bagaimana contoh script manampilkan form tapi setelah kita pilih radio button..
pilih radio button dulu baru keluar form...
jika tidak dipilih tidak tampil formnya...mohon bantuannya.
Silahkan login untuk menjawab!
2
Loading...
Ellyx Christian · Jun 15, 2011 · 2 Suka · 0 Tidak Suka
Agar lebih mudah gunakan jquery. Pertama element form yang mau ditampilkan saat radio button diklik ditaruh dalam sebuah div yang di-hide dengan menambahkan attribute style="display:none". Seperti ini:
<html>
	<head></head>
	<body>
		<form>
		Radio: <input type="radio" name="rad" id="rad1" value="1" class="rad"/> Form1 <input type="radio" name="rad" id="rad2" value="2" class="rad"/> Form2
			<!-- form yang mau ditampilkan-->
			<div id="form1" style="display:none">
				Input1: <input name="input" type="text"/>
			</div>
			<div id="form2" style="display:none">
				Input2: <input name="input" type="text"/>
			</div>
		</form>
		<!-- tambahkan jquery-->
		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
		<script type="text/javascript">
			$(function(){
				$(":radio.rad").click(function(){
					$("#form1, #form2").hide()
					if($(this).val() == "1"){
						$("#form1").show();
					}else{
						$("#form2").show();
					}
				});
			});
		</script>
	</body>
</html>
0
Loading...
Ressa Cahyani · Jun 26, 2011 · 0 Suka · 0 Tidak Suka
iya, thanks alot mas ellyx..
0
Loading...
Ellyx Christian · Jun 27, 2011 · 0 Suka · 0 Tidak Suka
@Ressa Cahyani: terima kasih kembali
0
Loading...
tryco · Jun 30, 2011 · 0 Suka · 0 Tidak Suka
makasih banyak mas ellyx tutorialnya..sangat membantu...tapi ada yang saya tanyakan mas, saya praktekan cara mas ellyx,tapi dalm form1 & 2 saya tambahin textboxnya dengan date. saya pakai datepicker jquery dengan image calendar..pertanyaan: ketika saya klik form1 muncul datepickernya beserta imagenya,tapi ketika saya klik form2 kok ga keluar ya mas...apakah jquerynya harus ada yang dirubah...makasih banyak sebelumnya...
0
Loading...
Ellyx Christian · Jun 30, 2011 · 0 Suka · 0 Tidak Suka
@tryco: saya rasa tidak perlu, kecuali ada salah dijquery yang kamu buat. Bisa lihat koding kamu?
0
Loading...
tryco · Jun 30, 2011 · 0 Suka · 0 Tidak Suka
<html>
<head>
<title>Input Proof On Delivery</title>
<link type="text/css" href="style.css" rel="stylesheet">
<link type="text/css" href="css/jquery.ui.all.css" rel="stylesheet">
<link type="text/css" href="css/jquery.ui.datepicker.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery-1.5.1.js"></script>
<script type="text/javascript" src="js/ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="js/ui/jquery.ui.datepicker.js"></script>
<script type="text/javascript">
$(function(){
$("#prdate").datepicker({
buttonImage:'css/images/calendar.gif',
buttonImageOnly:true,
showOn:'button'
});
});
</script>
</head>

<div id="body">
<form action="<? $_SERVER;?>" method="post" name="pencarian" id="pencarian">
<div align="center">No Connote :
<label>
<input name="conote" type="text" id="conote" maxlength="8" />
</label>
<label>
<input type="submit" name="submit" id="submit" value="submit" />
</label>
<p>Masukan Sesuai dengan Nomer Connote Anda</p>
</div>
<label></label>
<label></label>
</form>

<p>
<?php
include "koneksi_php.php";
$cn=$_POST;
$query = "";
$hasil = mysql_query ($query);
?>
<div id="description">
<table align="center" border="0">
<?php
while($row=mysql_fetch_array($hasil)){
?>
<tr>
<td colspan="7" align="center"><h1>Description</h1></td>
</tr>

<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td></td>
<td>&nbsp;</td>
<td bgcolor="#999999"><font color="#003300" face="Courier New, Courier, monospace"><?php echo date('d/m/Y');?></font></td>
</tr>
<tr>
<td width="8">&nbsp;</td>
<td width="89">No Connote</td>
<td width="6">:</td>
<td width="394"><font color="#FF0000" size="+1" face="Courier New, Courier, monospace"><?php echo $row;?></font></td>
<td width="86">Origin</td>
<td width="6">:</td>
<td width="144"><font color="#000066" face="Courier New, Courier, monospace" size="+1"><?php echo $row;?></font></td>
</tr>
<tr>
<td width="8">&nbsp;</td>
<td width="89">Customer</td>
<td>:</td>
<td><font color="#000066" face="Courier New, Courier, monospace" size="+1"><?php echo $row;?></font></td>
<td>Destination</td>
<td>:</td>
<td><font color="#000066" face="Courier New, Courier, monospace" size="+1"><?php echo $row;?></font></td>
</tr>
<tr>
<td width="8">&nbsp;</td>
<td width="89">Consigne</td>
<td>:</td>
<td><font color="#000066" face="Courier New, Courier, monospace" size="+1"><?php echo $row;?></font></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td width="8"></td>
<td width="89"></td>
<td></td>
<td><font color="#000066" face="Courier New, Courier, monospace" size="+1"><?php echo $row;?></font></td>
<td>Date Entry</td>
<td>:</td>
<td><font color="#000066" face="Courier New, Courier, monospace" size="+1"><?php echo $row;?></font></td>
</tr>
<tr>
<td width="8"></td>
<td width="89"></td>
<td></td>
<td><font color="#000066" face="Courier New, Courier, monospace" size="+1"><?php echo $row;?></font></td>
<td>Service</td>
<td>:</td>
<td><font color="#000066" face="Courier New, Courier, monospace" size="+1"><?php echo $row;?></font></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td><font color="#000066" face="Courier New, Courier, monospace" size="+1"><?php echo $row;?></font></td>
<td>No. Manifest</td>
<td>:</td>
<td><font color="#000066" face="Courier New, Courier, monospace" size="+1"><?php echo $row;?></font></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td colspan="2" align="center">
<form action="do_pilih.php" name="status">
Status
:
<input type="radio" name="pod" id="status1" value="C" class="pod"/>
Rejected
<input type="radio" name="pod" id="status2" value="Y" class="pod"/>
Success


<!-- form yang mau ditampilkan-->
<div id="form1" style="display:none">
<table>
<tr>
<td>Name</td><td>:</td><td><input name="prby" type="text"/></td></tr>
<tr><td>Date</td><td>:</td><td><input type="text" id="prdate" name="prdate"></td></tr>
<tr><td>Reason</td><td>:</td><td><select name=colpod><option value=0 selected>-- Alasan Rejected --</option>
<?php
$sql=mysql_query("select * from failed");
while ($data=mysql_fetch_array($sql)){
echo "<option value=$data[kode]>$data[kode]-$data[nama]</option>";
}
?>
</select></td></tr><tr><td></td><td></td><td><input type="submit" name="button" id="button" value="Save"></td></tr></table>
</div>
<div id="form2" style="display:none">
<table>
<tr><td>Nama</td><td>:</td><td><input name="prby" type="text"/></td></tr>
<tr><td>Jabatan</td><td>:</td><td><select name=colpod>
<option value=0 selected>--Status--</option>
<?php
/*include 'koneksi_php.php';*/
$sql=mysql_query("select * from relati");
while ($data=mysql_fetch_array($sql)){
echo "<option value=$data[kode]>$data[kode]-$data[nama]</option>";
}
?>
</select></td></tr>
<tr><td>Date</td><td> :</td><td><input type="text" id="prdate" name="prdate"></td></tr>
<tr><td>Time</td><td> :</td><td><input type="text" size="5"></td></tr>

<tr><td></td><td></td><td><input type="submit" name="button" id="button" value="Save"></td></tr>
</table>
</div>
</form>

<!-- tambahkan jquery-->

<script type="text/javascript">
$(function(){
$(":radio.pod").click(function(){
$("#form1, #form2").hide()
if($(this).val() == "C"){
$("#form1").show();
}else{
$("#form2").show();
}
});
});
</script> </td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<?php
}
?>
</table>
</div>

</p></div>
</html>

jadi saat saya click form1(rejected) muncul mas datepicker datenya, tapi setelah saya click form 2 di datenya tidak muncul,saya hanya masalah di situ mas..maff mas masih newbie..
0
Loading...
Ellyx Christian · Jun 30, 2011 · 0 Suka · 0 Tidak Suka
saya coba dan berhasil, coba hilangkan bagian style="display:none" pada form1 dan form2. Mungkin ada masalah dengan pembentukan form2. Dan install firebug untuk debug javascript.

note: pada saat menyisipkan koding gunakan cara yang dijelaskan di http://www.myphptutorials.com/syntax.html
0
Loading...
tryco · Jun 30, 2011 · 0 Suka · 0 Tidak Suka
sudah saya hilangkan style="display:none" nya mas, kok malah tampil dua2nya ya..dan tetep mas calender datepickernya yang form 2 ga muncul...jadi logikanya ketika klik radio button rejected keluar form1,ketika klik success muncul form2..munculnya form tergantung yang di klik radio buttonnya..sory mas banyak nanya..
0
Loading...
Ellyx Christian · Jun 30, 2011 · 0 Suka · 0 Tidak Suka
kamu install dulu firebug trus debug javascriptmu, biar tahu dimana salahnya.
0
Loading...
Ellyx Christian · Dec 25, 2022 · 0 Suka · 0 Tidak Suka

bisa lihat lagi tutorialnya di https://youtu.be/Cz0-1q8FvJ0