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>

avatar werich1
@werich1

89 Kontribusi 7 Poin

Diperbarui 4 tahun yang lalu

1 Jawaban:

Jawaban Terpilih

Semoga ini bisa membantu

<pre> &lt;?php //session_start(); error_reporting(0); $judul_halaman = '3 CHAINED DROPDOWN';

#koneksi ke database
$con = mysqli_connect(&quot;localhost&quot;,&quot;root&quot;,&quot;ganti_dgn_password_anda&quot;,&quot;harviacode&quot;);

?&gt; &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt; &lt;!-- The above 3 meta tags must come first in the head; any other head content must come after these tags --&gt; &lt;meta name="description" content=""&gt; &lt;meta name="author" content=""&gt; &lt;link rel="icon" href="aset/favicon.ico"&gt;

    &amp;lt;title&amp;gt;DEMO PHP - &amp;lt;?= $judul_halaman ?&amp;gt;&amp;lt;/title&amp;gt;

    &amp;lt;!-- Bootstrap core CSS --&amp;gt;
    &amp;lt;link href=&quot;aset/css/bootstrap.min.css&quot; rel=&quot;stylesheet&quot;&amp;gt;

    &amp;lt;!-- IE10 viewport hack for Surface/desktop Windows 8 bug --&amp;gt;
    &amp;lt;link href=&quot;aset/css/ie10-viewport-bug-workaround.css&quot; rel=&quot;stylesheet&quot;&amp;gt;

    &amp;lt;!-- Custom styles for this template --&amp;gt;
    &amp;lt;link href=&quot;aset/css/navbar-fixed-top.css&quot; rel=&quot;stylesheet&quot;&amp;gt;
    &amp;lt;script src=&quot;aset/js/jquery.min.js&quot;&amp;gt;&amp;lt;/script&amp;gt;
    &amp;lt;script src=&quot;aset/js/ie-emulation-modes-warning.js&quot;&amp;gt;&amp;lt;/script&amp;gt;
&amp;lt;/head&amp;gt;

&amp;lt;body&amp;gt;
    &amp;lt;!-- Fixed navbar --&amp;gt;
    &amp;lt;nav class=&quot;navbar navbar-inverse navbar-fixed-top&quot;&amp;gt;
        &amp;lt;div class=&quot;container&quot;&amp;gt;
            &amp;lt;div class=&quot;navbar-header&quot;&amp;gt;
                &amp;lt;button type=&quot;button&quot; class=&quot;navbar-toggle collapsed&quot; data-toggle=&quot;collapse&quot; data-target=&quot;#navbar&quot; aria-expanded=&quot;false&quot; aria-controls=&quot;navbar&quot;&amp;gt;
                    &amp;lt;span class=&quot;sr-only&quot;&amp;gt;Toggle navigation&amp;lt;/span&amp;gt;
                    &amp;lt;span class=&quot;icon-bar&quot;&amp;gt;&amp;lt;/span&amp;gt;
                    &amp;lt;span class=&quot;icon-bar&quot;&amp;gt;&amp;lt;/span&amp;gt;
                    &amp;lt;span class=&quot;icon-bar&quot;&amp;gt;&amp;lt;/span&amp;gt;
                &amp;lt;/button&amp;gt;
                &amp;lt;a class=&quot;navbar-brand&quot; href=&quot;https://harviacode.com&quot;&amp;gt;HARVIACODE&amp;lt;/a&amp;gt;
            &amp;lt;/div&amp;gt;
            &amp;lt;div id=&quot;navbar&quot; class=&quot;navbar-collapse collapse&quot;&amp;gt;
                &amp;lt;ul class=&quot;nav navbar-nav&quot;&amp;gt;
                    &amp;lt;li class=&quot;active&quot;&amp;gt;&amp;lt;a href=&quot;https://demo-php.harviacode.com&quot;&amp;gt;DEMO PHP&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;
                &amp;lt;/ul&amp;gt;
                &amp;lt;ul class=&quot;nav navbar-nav navbar-right&quot;&amp;gt;
                    &amp;lt;li class=&quot;active&quot;&amp;gt;&amp;lt;a href=&quot;&quot;&amp;gt;&amp;lt;?= $judul_halaman ?&amp;gt; &amp;lt;span class=&quot;sr-only&quot;&amp;gt;(current)&amp;lt;/span&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;
                &amp;lt;/ul&amp;gt;
            &amp;lt;/div&amp;gt;&amp;lt;!--/.nav-collapse --&amp;gt;
        &amp;lt;/div&amp;gt;
    &amp;lt;/nav&amp;gt;

    &amp;lt;!-- Main Content --&amp;gt;
    &amp;lt;div class=&quot;container&quot;&amp;gt;
        &amp;lt;div class=&quot;col-md-12&quot;&amp;gt;
            &amp;lt;div class=&quot;panel panel-primary&quot;&amp;gt;
                &amp;lt;div class=&quot;panel-heading&quot;&amp;gt;&amp;lt;b&amp;gt;&amp;lt;?= $judul_halaman ?&amp;gt;&amp;lt;/b&amp;gt;&amp;lt;/div&amp;gt;
                &amp;lt;div class=&quot;panel-body&quot;&amp;gt;
                    &amp;lt;div class=&quot;row&quot;&amp;gt;
                        &amp;lt;div class=&quot;col-md-12&quot;&amp;gt;

                            &amp;lt;div class=&quot;alert alert-info&quot;&amp;gt;&amp;lt;b&amp;gt;Mohon maaf karena keterbatasan sumber daya, kami membatasi jumlah data yang dimunculkan untuk masing-masing dropdown Kabupaten/ Kota dan Kecamatan.&amp;lt;/b&amp;gt;&amp;lt;/div&amp;gt;

                            &amp;lt;form class=&quot;form-horizontal&quot; method=&quot;post&quot;&amp;gt;

                                &amp;lt;div class=&quot;form-group&quot;&amp;gt;
                                    &amp;lt;div class=&quot;col-sm-6&quot;&amp;gt;
                                        &amp;lt;!--provinsi--&amp;gt;
                                        &amp;lt;select id=&quot;provinsi&quot; class=&quot;form-control&quot; name=&quot;provinsi&quot;&amp;gt;
                                            &amp;lt;option value=&quot;&quot;&amp;gt;Please Select&amp;lt;/option&amp;gt;
                                            &amp;lt;?php
                                                $query = mysqli_query($con, &quot;SELECT * FROM provinsi ORDER BY provinsi&quot;);
                                                while ($row = mysqli_fetch_array($query)) { ?&amp;gt;

                                                &amp;lt;option value=&quot;&amp;lt;?php echo $row[&#039;id_provinsi&#039;]; ?&amp;gt;&quot;&amp;gt;
                                                    &amp;lt;?php echo $row[&#039;provinsi&#039;]; ?&amp;gt;
                                                &amp;lt;/option&amp;gt;

                                            &amp;lt;?php } ?&amp;gt;
                                        &amp;lt;/select&amp;gt;
                                    &amp;lt;/div&amp;gt;

                                    &amp;lt;div class=&quot;col-sm-3&quot;&amp;gt;
                                        &amp;lt;!--kota--&amp;gt;
                                        &amp;lt;select id=&quot;kota&quot; class=&quot;form-control&quot; name=&quot;kota&quot;&amp;gt;
                                            &amp;lt;option value=&quot;&quot;&amp;gt;Please Select&amp;lt;/option&amp;gt;
                                            &amp;lt;?php
                                                $query = mysqli_query($con, &quot;SELECT * FROM kota INNER JOIN provinsi ON kota.id_provinsi_fk = provinsi.id_provinsi ORDER BY nama_kota&quot;);
                                                while ($row = mysqli_fetch_array($query)) { ?&amp;gt;

                                                &amp;lt;option id=&quot;kota&quot; class=&quot;&amp;lt;?php echo $row[&#039;id_provinsi&#039;]; ?&amp;gt;&quot; value=&quot;&amp;lt;?php echo $row[&#039;id_kota&#039;]; ?&amp;gt;&quot;&amp;gt;
                                                    &amp;lt;?php echo $row[&#039;nama_kota&#039;]; ?&amp;gt;
                                                &amp;lt;/option&amp;gt;

                                            &amp;lt;?php } ?&amp;gt;
                                        &amp;lt;/select&amp;gt;
                                    &amp;lt;/div&amp;gt;
                                    &amp;lt;div class=&quot;col-sm-3&quot;&amp;gt;
                                        &amp;lt;!--kecamatan--&amp;gt;
                                        &amp;lt;select id=&quot;kecamatan&quot; class=&quot;form-control&quot; name=&quot;kecamatan&quot;&amp;gt;
                                            &amp;lt;option value=&quot;&quot;&amp;gt;Please Select&amp;lt;/option&amp;gt;
                                            &amp;lt;?php
                                                $query = mysqli_query($con, &quot;SELECT * FROM kecamatan INNER JOIN kota ON kecamatan.id_kota_fk = kota.id_kota ORDER BY nama_kecamatan&quot;);
                                                while ($row = mysqli_fetch_array($query)) { ?&amp;gt;

                                                &amp;lt;option id=&quot;kecamatan&quot; class=&quot;&amp;lt;?php echo $row[&#039;id_kota&#039;]; ?&amp;gt;&quot; value=&quot;&amp;lt;?php echo $row[&#039;id_kecamatan&#039;]; ?&amp;gt;&quot;&amp;gt;
                                                    &amp;lt;?php echo $row[&#039;nama_kecamatan&#039;]; ?&amp;gt;
                                                &amp;lt;/option&amp;gt;

                                            &amp;lt;?php } ?&amp;gt;
                                        &amp;lt;/select&amp;gt;
                                    &amp;lt;/div&amp;gt;
                                &amp;lt;/div&amp;gt;   
                            &amp;lt;/form&amp;gt;
                        &amp;lt;/div&amp;gt;
                    &amp;lt;/div&amp;gt;
                &amp;lt;/div&amp;gt;
                &amp;lt;div class=&quot;panel-footer&quot;&amp;gt;&amp;lt;small&amp;gt;© &amp;lt;?= date(&#039;Y&#039;) ?&amp;gt; &amp;lt;a href=&quot;https://harviacode.com&quot; target=&quot;_blank&quot;&amp;gt;Harviacode&amp;lt;/a&amp;gt;&amp;lt;/small&amp;gt;&amp;lt;/div&amp;gt;
            &amp;lt;/div&amp;gt;
        &amp;lt;/div&amp;gt;
    &amp;lt;/div&amp;gt;

    &amp;lt;!-- Bootstrap core JavaScript
    ================================================== --&amp;gt;
    &amp;lt;script src=&quot;aset/js/bootstrap.min.js&quot;&amp;gt;&amp;lt;/script&amp;gt;
    &amp;lt;script src=&quot;aset/js/jquery-chained.min.js&quot;&amp;gt;&amp;lt;/script&amp;gt;
    &amp;lt;!-- IE10 viewport hack for Surface/desktop Windows 8 bug --&amp;gt;
    &amp;lt;script src=&quot;aset/js/ie10-viewport-bug-workaround.js&quot;&amp;gt;&amp;lt;/script&amp;gt;
    &amp;lt;script&amp;gt;
        $(document).ready(function() {
            $(&quot;#kota&quot;).chained(&quot;#provinsi&quot;);
            $(&quot;#kecamatan&quot;).chained(&quot;#kota&quot;);
        });
    &amp;lt;/script&amp;gt;
&amp;lt;/body&amp;gt;

&lt;/html&gt; </pre>

avatar Enma
@Enma

3 Kontribusi 2 Poin

Dipost 4 tahun yang lalu

Login untuk ikut Jawaban