Postingan lainnya
Chained dropdown ketiga eror dmna?
gan ane bikin 3 chained dropdown, 1 dan 2 masih bisa beralasi dan kebuka ketika provinsi dipilih tapi dari kab ke kecamatan langsung ga mau tampil kecamatanny itu gmna ya ?
<div class="container-fluid">
<!-- Page Heading -->
<h1 class="h3 mb-4 text-gray-800"><?= $title; ?></h1>
<a href="" class="btn btn-primary mb-3" data-toggle="modal" data-target="#tambahSupply">Add Supplier</a>
<br>
<br>
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Cabang Supplier</th>
<th scope="col">Email</th>
</tr>
</thead>
<tbody>
<?php $i = 1; ?>
<?php foreach ($supplier as $s) : ?>
<tr>
<th scope="row"><?= $i++; ?></th>
<td><?= $s['lokasi']; ?></td>
<td><?= $s['email']; ?></td>
<td><a href="<?= base_url(); ?>admin/edit_barang/<?= $s['id_sup']; ?>" class="badge badge-success">Edit</a>
<a href="<?= base_url(); ?>admin/hapus/<?= $s['id_sup']; ?>" class="badge badge-danger">Delete</a>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
<div class="modal fade" id="tambahSupply" tabindex="-1" role="dialog" aria-labelledby="tambahSupply" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="tambahSupply">Order</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<?php echo form_open_multipart('admin/regis_supplier'); ?>
<div class="modal-body">
<!-- Begin Page Content -->
<div class="form-group">
<label>Provinsi</label>
<select class="form-control" name="supplier" id="supplier">
<option value="">Please Select</option>
<?php
foreach ($wilayah as $s) {
?>
<option <?php echo $provinsi_selected == $s->id ? 'selected="selected"' : '' ?> value="<?php echo $s->id ?>"><?php echo $s->provNama ?></option>
<?php
}
?>
</select>
</div>
<div class="form-group">
<label>Kota</label>
<select class="form-control" name="barang" id="barang">
<option value="">Please Select</option>
<?php
foreach ($wilayahb as $kot) {
?>
<!--di sini kita tambahkan class berisi id provinsi-->
<option <?php echo $kota_selected == $kot->provinsi_id ? 'selected="selected"' : '' ?> class="<?php echo $kot->provinsi_id ?>" value="<?php echo $kot->id ?>"><?php echo $kot->KabNama ?></option>
<?php
}
?>
</select>
</div>
<div class="form-group">
<label>Kecamatan</label>
<select class="form-control" name="camat" id="camat">
<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 ? 'selected="selected"' : '' ?> class="<?php echo $kec->kabupaten_id ?>" value="<?php echo $kec->id ?>"><?php echo $kec->kecNama ?></option>
<?php
}
?>
</select>
</div>
<div class="form-group">
<input type="text" class="form-control" id="lokasi" name="lokasi" placeholder="Cabang Supplier">
</div>
<div class="form-group">
<input type="email" class="form-control" id="email" name="email" placeholder="Masukan Email Supplier">
</div>
<div class="form-group">
<input type="password" class="form-control" id="passowrd" name="password" placeholder="Masukan Passowrd">
</div>
<div class="form-group">
<input class="form-control" type="hidden" name="is_active" id="is_active" />
</div>
<div class="form-group">
<input class="form-control" type="hidden" name="sup_img" id="sup_img" />
</div>
<div class="form-group">
<input class="form-control" type="hidden" name="role_id" id="role_id" />
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Add Supplier</button>
</div>
</form>
</div>
</div>
<script src="<?= base_url('assets/js/jquery-1.10.2.min.js') ?>"></script>
<script src="<?= base_url('assets/js/jquery.chained.min.js') ?>"></script>
<script>
$("#barang").chained("#supplier"); // disini kita hubungkan kota dengan provinsi
$("#camat").chained("#barang");
// disini kita hubungkan kecamatan dengan kota
</script>
</script>
</div>
</div>
</div>
1 Jawaban:
Jawaban Terpilih
Semoga ini bisa membantu
<pre> <?php //session_start(); error_reporting(0); $judul_halaman = '3 CHAINED DROPDOWN';
#koneksi ke database
$con = mysqli_connect("localhost","root","ganti_dgn_password_anda","harviacode");
?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- The above 3 meta tags must come first in the head; any other head content must come after these tags --> <meta name="description" content=""> <meta name="author" content=""> <link rel="icon" href="aset/favicon.ico">
&lt;title&gt;DEMO PHP - &lt;?= $judul_halaman ?&gt;&lt;/title&gt;
&lt;!-- Bootstrap core CSS --&gt;
&lt;link href="aset/css/bootstrap.min.css" rel="stylesheet"&gt;
&lt;!-- IE10 viewport hack for Surface/desktop Windows 8 bug --&gt;
&lt;link href="aset/css/ie10-viewport-bug-workaround.css" rel="stylesheet"&gt;
&lt;!-- Custom styles for this template --&gt;
&lt;link href="aset/css/navbar-fixed-top.css" rel="stylesheet"&gt;
&lt;script src="aset/js/jquery.min.js"&gt;&lt;/script&gt;
&lt;script src="aset/js/ie-emulation-modes-warning.js"&gt;&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;!-- Fixed navbar --&gt;
&lt;nav class="navbar navbar-inverse navbar-fixed-top"&gt;
&lt;div class="container"&gt;
&lt;div class="navbar-header"&gt;
&lt;button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"&gt;
&lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
&lt;span class="icon-bar"&gt;&lt;/span&gt;
&lt;span class="icon-bar"&gt;&lt;/span&gt;
&lt;span class="icon-bar"&gt;&lt;/span&gt;
&lt;/button&gt;
&lt;a class="navbar-brand" href="https://harviacode.com"&gt;HARVIACODE&lt;/a&gt;
&lt;/div&gt;
&lt;div id="navbar" class="navbar-collapse collapse"&gt;
&lt;ul class="nav navbar-nav"&gt;
&lt;li class="active"&gt;&lt;a href="https://demo-php.harviacode.com"&gt;DEMO PHP&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul class="nav navbar-nav navbar-right"&gt;
&lt;li class="active"&gt;&lt;a href=""&gt;&lt;?= $judul_halaman ?&gt; &lt;span class="sr-only"&gt;(current)&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;&lt;!--/.nav-collapse --&gt;
&lt;/div&gt;
&lt;/nav&gt;
&lt;!-- Main Content --&gt;
&lt;div class="container"&gt;
&lt;div class="col-md-12"&gt;
&lt;div class="panel panel-primary"&gt;
&lt;div class="panel-heading"&gt;&lt;b&gt;&lt;?= $judul_halaman ?&gt;&lt;/b&gt;&lt;/div&gt;
&lt;div class="panel-body"&gt;
&lt;div class="row"&gt;
&lt;div class="col-md-12"&gt;
&lt;div class="alert alert-info"&gt;&lt;b&gt;Mohon maaf karena keterbatasan sumber daya, kami membatasi jumlah data yang dimunculkan untuk masing-masing dropdown Kabupaten/ Kota dan Kecamatan.&lt;/b&gt;&lt;/div&gt;
&lt;form class="form-horizontal" method="post"&gt;
&lt;div class="form-group"&gt;
&lt;div class="col-sm-6"&gt;
&lt;!--provinsi--&gt;
&lt;select id="provinsi" class="form-control" name="provinsi"&gt;
&lt;option value=""&gt;Please Select&lt;/option&gt;
&lt;?php
$query = mysqli_query($con, "SELECT * FROM provinsi ORDER BY provinsi");
while ($row = mysqli_fetch_array($query)) { ?&gt;
&lt;option value="&lt;?php echo $row['id_provinsi']; ?&gt;"&gt;
&lt;?php echo $row['provinsi']; ?&gt;
&lt;/option&gt;
&lt;?php } ?&gt;
&lt;/select&gt;
&lt;/div&gt;
&lt;div class="col-sm-3"&gt;
&lt;!--kota--&gt;
&lt;select id="kota" class="form-control" name="kota"&gt;
&lt;option value=""&gt;Please Select&lt;/option&gt;
&lt;?php
$query = mysqli_query($con, "SELECT * FROM kota INNER JOIN provinsi ON kota.id_provinsi_fk = provinsi.id_provinsi ORDER BY nama_kota");
while ($row = mysqli_fetch_array($query)) { ?&gt;
&lt;option id="kota" class="&lt;?php echo $row['id_provinsi']; ?&gt;" value="&lt;?php echo $row['id_kota']; ?&gt;"&gt;
&lt;?php echo $row['nama_kota']; ?&gt;
&lt;/option&gt;
&lt;?php } ?&gt;
&lt;/select&gt;
&lt;/div&gt;
&lt;div class="col-sm-3"&gt;
&lt;!--kecamatan--&gt;
&lt;select id="kecamatan" class="form-control" name="kecamatan"&gt;
&lt;option value=""&gt;Please Select&lt;/option&gt;
&lt;?php
$query = mysqli_query($con, "SELECT * FROM kecamatan INNER JOIN kota ON kecamatan.id_kota_fk = kota.id_kota ORDER BY nama_kecamatan");
while ($row = mysqli_fetch_array($query)) { ?&gt;
&lt;option id="kecamatan" class="&lt;?php echo $row['id_kota']; ?&gt;" value="&lt;?php echo $row['id_kecamatan']; ?&gt;"&gt;
&lt;?php echo $row['nama_kecamatan']; ?&gt;
&lt;/option&gt;
&lt;?php } ?&gt;
&lt;/select&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/form&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="panel-footer"&gt;&lt;small&gt;© &lt;?= date('Y') ?&gt; &lt;a href="https://harviacode.com" target="_blank"&gt;Harviacode&lt;/a&gt;&lt;/small&gt;&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- Bootstrap core JavaScript
================================================== --&gt;
&lt;script src="aset/js/bootstrap.min.js"&gt;&lt;/script&gt;
&lt;script src="aset/js/jquery-chained.min.js"&gt;&lt;/script&gt;
&lt;!-- IE10 viewport hack for Surface/desktop Windows 8 bug --&gt;
&lt;script src="aset/js/ie10-viewport-bug-workaround.js"&gt;&lt;/script&gt;
&lt;script&gt;
$(document).ready(function() {
$("#kota").chained("#provinsi");
$("#kecamatan").chained("#kota");
});
&lt;/script&gt;
&lt;/body&gt;
</html> </pre>