INDONESIANWARE - Pada Artikel yang anda baca kali ini dengan judul Membuat Chained Combobox dengan jQuery Ajax PHP, kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan
Artikel PHP, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.
Judul : Membuat Chained Combobox dengan jQuery Ajax PHP
link : Membuat Chained Combobox dengan jQuery Ajax PHP
Membuat Chained Combobox dengan jQuery Ajax PHP
Karena sudah lumayan lama tidak memposting, pada siang hari ini saya kana memposting tentang Membuat Chained Combobox dengan jQuery Ajax PHP, yang dimaksud dengan chained combobox ialah combobox yang saling berkaitan antara 1 dengan yang lainnya, misalnya saja jika anda pernah melihat sebuah website disitu ada 2 buah combobox, combobox pertama untuk memilih provinsi, combobox ke 2 untuk memilih kota, ketika kita memilih salah satu provinsi pada combobox yang ada di provinsi maka pada combobox ke 2 akan muncul kota - kota yang ada di provinsi yang kita pilih tersebut.Langkah - langkah Membuat Chained Combobox dengan jQuery Ajax PHP
1. Buat sebuah folder pada C:\xampp\htdocs dengan nama chained-combobox
2. Buat database dengan nama latihan, lalu buat 2 buah table dengan nama kategori dan sub_kategori
CREATE TABLE kategori (
kd_kategori int (2) primary key auto_increment,
kategori varchar(20)
)
CREATE TABLE sub_kategori (
kd_subkategori int (2) primary key auto_increment,
kd_kategori int (2),
kategori varchar(20)
)
Isikan data pada table kategori dan subkategori sesuai dengan keinginan anda3. Buat sebuah file php pada folder chained-combobox dengan nama koneksi.php
<?php
$server="localhost";
$username="root"; // username mysql
$password="root"; // password mysql
$db="latihan"; // nama database
$koneksi=mysql_connect($server,$username,$password) or die ("Gagal terkoneksi ke server");
$database=mysql_select_db($db) or die ("Database tidak ditemukan");
?>
4. Buat sebuah file php pada folder chained-combobox dengan nama getsubkategori.php
<?php
include "koneksi.php";
$id=$_POST['id'];
$query=mysql_query("select * from sub_kategori where kd_kategori='".$id."'");
$row=mysql_num_rows($query);
if ($row > 0)
{
while ($data=mysql_fetch_array($query))
{
echo "<option value=".$data["kd_subkategori"].">".$data["subkategori"]."</option>";
}
}
?>
5. Buat sebuah file php pada folder chained-combobox dengan nama index.php
<?php include"koneksi.php";?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Chained Combobox jQuery Ajax PHP</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script> <!-- include file jquery.min.js -->
</head>
<body>
<script type="text/javascript">
$(document).ready(function()
{
<!-- handle event combobox kategori ketika nilainya di ganti -->
$("#combokategori").change(function() {
<!-- mendapatkan value dari combobox -->
var idkategori = $(this).val();
if (idkategori != "")
{
<!-- Request data sub kategori berdasarkan idkategori yang dipilih -->
$.ajax({
type:"post",
url:"getsubkategori.php",
data:"id="+ idkategori,
success: function(data){
$("#subkategori").html(data);
}
});
}
});
});
</script>
Pilih Kategori
<br>
<!-- combobox kategori -->
<select name="kategori" id="combokategori">
<option value="">Pilih kategori</option>
<?php
$query=mysql_query("select * from kategori");
while ($data=mysql_fetch_array($query))
{
?>
<option value="<?php echo $data['kd_kategori'];?>"><?php echo $data['kategori'];?></option>
<?php }?>
</select>
<br>
Pilih Subkategori
<br>
<!-- combobox untuk subkategori -->
<select name="subkategori" id="subkategori">
<option selected="selected">Pilih subkategori</option>
</select>
</body>
</html>
6. Buka browser dan buka http://localhost/chained-combobox/
Anda bisa mendownload source codenya disini
Sekianlah artikel Membuat Chained Combobox dengan jQuery Ajax PHP kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya.
Anda sekarang membaca artikel Membuat Chained Combobox dengan jQuery Ajax PHP dengan alamat link https://ware-id.blogspot.com/2014/09/membuat-chained-combobox-dengan-jquery.html
EmoticonEmoticon