Menampilkan Data Pilihan Dari Dropdown Ke Radio Button Kemudian Menampilkan Pilihan Radio Button Ke Textbox

Akhirnya ketemu juga, bagaimana cara membuat data chain dari dropdown ke radio button kemudian menampilkan pilihan dari radio button ke textbox, cukup membuat gila juga ni script, berjam-jam nyari gimana caranya, dan akhirnya resolved -___-
untuk lebih jelasnya langsung ke script nya aja :

Buat sebuah folder di htdocs kamu, misal tes, kemudian di dalam folder buat file dengan extensi .php. Misal chain.php kemudian copy paste script berikut ke file yang dibuat :


<?php
$value = "";
echo $dif = empty($_POST["submit"])?"":$_POST["dif"];
?>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('.radioOption').hide();
$('#produk1').show();
$('#selectField').change(function () {
$('.radioOption').hide();
$('#'+$(this).val()).show();
});
});
function dataToText(obj)
{
var difference = obj.value;
document.getElementById("price").value = difference;
}
</script>

<div align="left" style="border: 2px #f0f0f0 solid;height: auto; width: 200px;padding:20px;">
<select id="selectField">
<option value="produk1">produk1</option>
<option value="produk2">produk2</option>
<option value="produk3">produk3</option>
<option value="produk4">produk4</option>
</select>
<br/>
<br/>
<label>Harga</label>
<div id="produk1" class="radioOption">
<input type="radio" onclick="dataToText(this)" value="harga 1 produk 1"> Harga 1
<br/>
<input type="radio" onclick="dataToText(this)" value="harga 2 produk 1"> Harga 2
</div>
<div id="produk2" class="radioOption">
<input type="radio" onclick="dataToText(this)" value="harga 1 produk 2"> Harga 1
<br/>
<input type="radio" onclick="dataToText(this)" value="harga 2 produk 2"> Harga 2
</div>
<div id="produk3" class="radioOption">
<input type="radio" onclick="dataToText(this)" value="harga 1 produk 3"> Harga 1
<br/>
<input type="radio" onclick="dataToText(this)" value="harga 2 produk 3"> Harga 2
</div>
<div id="produk4" class="radioOption">
<input type="radio" onclick="dataToText(this)" value="harga 1 produk 4"> Harga 1
<br/>
<input type="radio" onclick="dataToText(this)" value="harga 2 produk 4"> Harga 2
</div>
<br/>
<br/>
<input type="text" id="price" value="<?php echo $value; ?>" name="dif">
</div>


Kemudian save. Buka browser kamu, masukkan url localhost/tes/chain.php -> Tekan Enter
Maka akan tampilan sebagai berikut :



Jangan pernah menyerah ketika kita terjatuh, terus berusaha dan berusaha hingga kita mampu berdiri kembali :) thanx for visiting my blog :)

You Might Also Like

0 comments