Pada tutuorial kali ini saya akan membahas tentang drop down pada CI, yaitu Bagaimana Cara Membuat Chained Dropdown Di Codeigniter sebenarnya membuat chained dropdown juga bisa jika tidak menggunakan codeigniter.
Yang di maksud chained dropdown adalah, dropdwon yang bergantung dengan dropdown lainya, misal jika kita memilih provinsi tertentu maka dropdown turunanya hanya akan menampilkan value bergantung dari value apa yang di pilih pada dropdown awalnya.
sebelumnya di harapkan teman-teman membuat dahulllu databasenya ya, saya hanya memberikan contoh penggunaanya saja, jadi di sini saya akan membuat chained dropdown memilih provinsi dan kota yang mana jika memilih provinsi tertntu maka di dropdown selanjutnya akan tampil kota berdasarkan provinsi tersebut dan kecamatan berdasarkan kota tersebut.
Baik kita mulai saja , Kita buat Model bernama Chain_model.php :
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Chain_model extends CI_Model {
public function get_provinsi()
{
$this->db->order_by('nama_provinsi', 'asc');
return $this->db->get('provinsi')->result();
}
public function get_kota()
{
// kita joinkan tabel kota dengan provinsi
$this->db->order_by('nama_kota', 'asc');
$this->db->join('provinsi', 'kota.id_provinsi_fk = provinsi.id_provinsi');
return $this->db->get('kota')->result();
}
public function get_kecamatan()
{
// kita joinkan tabel kecamatan dengan kota
$this->db->order_by('nama_kecamatan', 'asc');
$this->db->join('kota', 'kecamatan.id_kota_fk = kota.id_kota');
return $this->db->get('kecamatan')->result();
}
// untuk edit ambil dari id level paling bawah
public function get_selected_by_id_kecamatan($id_kecamatan)
{
$this->db->where('id_kecamatan', $id_kecamatan);
$this->db->join('kota', 'kecamatan.id_kota_fk = kota.id_kota');
$this->db->join('provinsi', 'kota.id_provinsi_fk = provinsi.id_provinsi');
return $this->db->get('kecamatan')->row();
}
}
Kita buat Controller bernama Chain.php
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Chain extends CI_Controller {
public function __construct()
{
parent::__construct();
$this->load->model('Chain_model');
}
// untuk add
public function index()
{
$data = array(
'provinsi' => $this->Chain_model->get_provinsi(),
'kota' => $this->Chain_model->get_kota(),
'kecamatan' => $this->Chain_model->get_kecamatan(),
'provinsi_selected' => '',
'kota_selected' => '',
'kecamatan_selected' => '',
);
$this->load->view('chain', $data);
}
// untuk edit
public function edit()
{
// realnya ambil data dari database, misalnya kita dapatkan data sbb:
$id_kecamatan = 4;
// kita ambil data selected nya untuk selected option
$selected = $this->Chain_model->get_selected_by_id_kecamatan($id_kecamatan);
$data = array(
'provinsi' => $this->Chain_model->get_provinsi(),
'kota' => $this->Chain_model->get_kota(),
'kecamatan' => $this->Chain_model->get_kecamatan(),
'provinsi_selected' => $selected->id_provinsi,
'kota_selected' => $selected->id_kota,
'kecamatan_selected' => $selected->id_kecamatan,
);
$this->load->view('chain', $data);
}
public function aksi_form()
{
// datanya bisa kita insert ke DB atau yang lain
// di sini saya hanya menampilkan datanya saja
var_dump($this->input->post());
}
}
kita buat view chain.php :
<!doctype html>
<html>
<head>
<title>Chain Dropdown</title>
<link rel="stylesheet" href="<?php echo base_url('assets/bootstrap/css/bootstrap.css') ?>"/>
</head>
<body>
<div class="container">
<div class="col-md-6">
<h2>Chain Dropdown Example</h2>
<form action="<?php echo site_url('chain/aksi_form') ?>" method="post">
<div class="form-group">
<label>Provinsi</label>
<select class="form-control" name="provinsi" id="provinsi">
<option value="">Please Select</option>
<?php
foreach ($provinsi as $prov) {
?>
<option <?php echo $provinsi_selected == $prov->id_provinsi ? 'selected="selected"' : '' ?>
value="<?php echo $prov->id_provinsi ?>"><?php echo $prov->nama_provinsi ?></option>
<?php
}
?>
</select>
</div>
<div class="form-group">
<label>Kota</label>
<select class="form-control" name="kota" id="kota">
<option value="">Please Select</option>
<?php
foreach ($kota as $kot) {
?>
<!--di sini kita tambahkan class berisi id provinsi-->
<option <?php echo $kota_selected == $kot->id_provinsi_fk ? 'selected="selected"' : '' ?>
class="<?php echo $kot->id_provinsi_fk ?>" value="<?php echo $kot->id_kota ?>"><?php echo $kot->nama_kota ?></option>
<?php
}
?>
</select>
</div>
<div class="form-group">
<label>Kecamatan</label>
<select class="form-control" name="kecamatan" id="kecamatan">
<option value="">Please Select</option>
<?php
foreach ($kecamatan as $kec) {
?>
<!--di sini kita tambahkan class berisi id kota-->
<option <?php echo $kecamatan_selected == $kec->id_kecamatan ? 'selected="selected"' : '' ?>
class="<?php echo $kec->id_kota_fk ?>" value="<?php echo $kec->id_kecamatan ?>"><?php echo $kec->nama_kecamatan ?></option>
<?php
}
?>
</select>
</div>
<div class="form-group">
<input type="submit" class="btn btn-primary" value="Simpan">
</div>
</form>
</div>
</div>
</body>
<html>
lalu letakan script berikut sebelum penutup body:
<script src=“<?php echo base_url(‘assets/js/jquery-1.10.2.min.js’) ?>”></script>
<script src=“<?php echo base_url(‘assets/js/jquery.chained.min.js’) ?>”></script>
<script>
$(“#kota”).chained(“#provinsi”); // disini kita hubungkan kota dengan provinsi
$(“#kecamatan”).chained(“#kota”); // disini kita hubungkan kecamatan dengan kota
</script>
sekarang coba di jalankan, nah project jadi beserta database dan jquerynya bisa di download DISINI
baiklah itu saja dari saya tentang
The post Bagaimana Cara Membuat Chained Dropdown Di Codeigniter appeared first on Kursus Website Terbaik.