Advertisement
Bedhoel

Table Change Ajax

Sep 28th, 2018
135
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
PHP 3.15 KB | None | 0 0
  1. <body>
  2.     <div class="container">
  3.         <div class="row"><br/>
  4.             <div class="col-md-12">
  5.                 <label>Provinsi</label>
  6.                 <select autocompelete="off" onchange="getkabkot()" name="provinsi" id="provinsi" class="form-control">
  7.                      <option value="">Pilih Provinsi</option>
  8.                      <?php
  9.                         $data_prov = $gen_model->GetWhere('provinces');
  10.                             while($list = $data_prov->FetchRow()){
  11.                                 foreach($list as $key=>$val){
  12.                                 $key=strtolower($key);
  13.                                 $$key=$val;
  14.                               }  ?>
  15.                             <option value="<?php echo $id ?>"><?php echo $name ?></option>
  16.                     <?php } ?>
  17.                 </select>
  18.             </div>
  19.         </div>
  20.         <div class="row"><br/>
  21.             <div class="col-md-12">
  22.                 <label>Kota / Kabupaten</label>
  23.                 <select autocompelete="off" onchange="getkecamatan()"  name="kabkot" id="kabkot" class="form-control">
  24.                      <option value="">Pilih Kota / Kabupaten</option>
  25.                 </select>
  26.             </div>
  27.         </div>
  28.         <div class="row"><br/>
  29.             <div class="col-md-12">
  30.                 <label>Kecamatan</label>
  31.                 <select autocompelete="off" onchange="getkelurahan()" name="kecamatan" id="kecamatan" class="form-control">
  32.                      <option value="">Pilih Kecamatan</option>
  33.                 </select>
  34.             </div>
  35.         </div>
  36.         <div class="row"><br/>
  37.             <div class="col-md-12">
  38.                 <label>Kelurahan</label>
  39.                 <select autocompelete="off" name="kelurahan" id="kelurahan" class="form-control">
  40.                      <option value="">Pilih Kelurahan</option>
  41.                 </select>
  42.             </div>
  43.         </div>
  44.     </div>
  45.     <br/>
  46.     <table style="width:50%" class="table table-bordered" id="table_kabkot">
  47.         <tr>
  48.             <td>ID Kabkot</td>
  49.             <td>Nama Kabkot</td>
  50.         </tr>
  51.     </table>
  52.     <script type="text/javascript">
  53.  
  54.         function getkabkot(){
  55.             var prov = $("#provinsi").val();
  56.             if(prov!=""){
  57.                 $.ajax({
  58.                     url: '<?php echo $basepath ?>ajax/getkabkot',
  59.                     type: 'POST',
  60.                     dataType: 'html',
  61.                     data: 'id_prov='+prov,
  62.                     success: function(getdata) {
  63.                         $("#table_kabkot").html(getdata);
  64.                         $("#kecamatan").html("");
  65.                         $("#kelurahan").html("");
  66.                     }
  67.                 });
  68.             }
  69.             else {
  70.                 $("#kabkot").html("");
  71.                 $("#kecamatan").html("");
  72.                 $("#kelurahan").html("");
  73.             }
  74.         }
  75.         function getkecamatan(){
  76.             var kabkot = $("#kabkot").val();
  77.             if(kabkot!=""){
  78.                 $.ajax({
  79.                     url: '<?php echo $basepath ?>ajax/getkecamatan',
  80.                     type: 'POST',
  81.                     dataType: 'html',
  82.                     data: 'id_kabkot='+kabkot,
  83.                     success: function(getdata) {
  84.                         $("#kecamatan").html(getdata);
  85.                         $("#kelurahan").html("");
  86.                     }
  87.                 });
  88.             }
  89.             else {
  90.                 $("#kecamatan").html("");
  91.                 $("#kelurahan").html("");
  92.             }
  93.         }
  94.         function getkelurahan(){
  95.             var kecamatan = $("#kecamatan").val();
  96.             if(kecamatan!=""){
  97.                 $.ajax({
  98.                     url: '<?php echo $basepath ?>ajax/getkelurahan',
  99.                     type: 'POST',
  100.                     dataType: 'html',
  101.                     data: 'id_kecamatan='+kecamatan,
  102.                     success: function(getdata) {
  103.                         $("#kelurahan").html(getdata);
  104.                     }
  105.                 });
  106.             }
  107.             else {
  108.                 $("#kelurahan").html("");
  109.             }
  110.         }
  111.     </script>
  112. </body>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement