2014-09-01 87 views
0

我有這樣的代碼下面的代碼給我兩個選擇選項,如何在類kecamatan改變選擇值當我選擇kota_kabupaten階級值,變化的其他選擇值與jQuery

例如:當我在第一個選擇選項(class kota_kabupaten)中選擇「tangerang」,然後在第二個select(class kecamatan)中選擇值爲「balaraja」和「bitung」而沒有「balong」。

之前感謝您的幫助:d

的JavaScript

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $(".kota_kabupaten").change(function(){     
     var kab = $(".kota_kabupaten option:selected").val(); 
     //do something here 
    }); 
    }); 
</script> 

HTML/PHP

<select class="form-control kota_kabupaten"> 
    <?php 
    $kab = array(
    'tangerang'=>array('balajara','bitung'), 
    'banten' => array('balong') 
    ); 
    foreach ($kab as $kab => $kecamatan){ 
    echo "<option value=".$kab.">".$kab."</option>" ; 
     } 
?> 
</select> 
<select class="form-control kecamatan" name = "kecamatan" id="kecamatan"> 
    <?php 
    $kab = array(
     'tangerang'=>array('balajara','bitung'), 
     'banten' => array('balong') 
     ); 
     $kabupaten="tangerang"; // this line just for example when the value is exist 
     foreach ($kab as $kab => $kecamatan){ 
     if(is_array($kecamatan)){ 
      foreach ($kecamatan as $key => $value) { 
      if($kab==$kabupaten){ 
      echo "<option value=".$value.">".$value."</option>" ; 
      } 
      } 
     } 
     } 
    ?> 
    </select> 
+0

你能用元素解釋呢? – 2014-09-01 11:52:49

回答

1

爲什麼不能你使用Ajax的一樣嗎? PHP/JQuery(Ajax)。如果需要,示例工作代碼就在這裏。

http://phpfiddle.org/main/code/uhrz-pnfe

PHP/JQUERY - AJAX

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(e) { 
    $(".kota_kabupaten").change(function(){ 
     //alert('here'); 

     var parent_selected_value = $(this).val(); 
     alert("You have selected : "+parent_selected_value); 


     $.ajax({ 
      type: "POST", 
      url: "../ajax/ajax.php", 
      data: "selected_value="+parent_selected_value+"&type=dependent_dropdown", //you can POST multiple parameters 
      //data: ({name: value, email:value, phone: value}), 
      success: function(data){ 
       alert(data); 
       $("#kecamatan").html(''); 
       $("#kecamatan").html(data); 
      } 
     });   
    }); 
}); 
</script> 
</head> 
<body> 

    <select class="form-control kota_kabupaten"> 
    <?php 
    $kab = array(
     'tangerang'=>array('balajara','bitung'), 
     'banten' => array('balong') 
    ); 

echo "<option value=''>--Please Select--</option>" ; 
    foreach ($kab as $kab => $kecamatan){ 
     echo "<option value=".$kab.">".$kab."</option>" ; 
    } 
?> 
</select> 

<select class="form-control kecamatan" name = "kecamatan" id="kecamatan"> 
    <option value=''>--Please Select--</option> 
    </select> 
</body> 
</html> 

AJAX.PHP

<?php 
    if(isset($_REQUEST['type'])) 
    { 
     $type=$_REQUEST['type']; 
     switch($type) 
     { 
      case "dependent_dropdown": 
       $kab = array(
        'tangerang'=>array('balajara','bitung'), 
        'banten' => array('balong') 
       ); 

      $child_array = $kab[$_REQUEST['selected_value']]; 
      echo "<option value=''>--Please Select--</option>" ; 
      foreach ($child_array as $kab){ 
       echo "<option value=".$kab.">".$kab."</option>" ; 
      } 

      break; 



      default: 
       echo "ERROR, some problem in ajax type"; 
      break; 
     } 


    } 
    else 
    { 
     echo "ERROR, some problem in ajax"; 
    } 
?> 
+0

美妙,它的工作..感謝很多@Pragnesh,你是非常有益的..:D – Sandhi 2014-09-01 16:02:54

0

我相信這工作得很好。

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $(".kota_kabupaten").change(function(){     
    var kabSel = $(this).val(); // CHANGE THIS LINE 
    values=kab[kabSel]; 
    opt=""; 
    for(i in values){ 
     opt+="<option value='"+values[i]+"' >"+values[i]+"</option>"; 
    } 
    $("#kecamatan").html(opt); 
    }); 
    }); 
</script> 

PHP

<select class="form-control kota_kabupaten"> 
    <?php 
    $kab = array(
    'tangerang'=>array('balajara','bitung'), 
    'banten' => array('balong') 
    ); 
    foreach ($kab as $kab => $kecamatan){ 
    echo "<option value=".$kab.">".$kab."</option>" ; 
     } 
?> 
</select> 
<script> 
$(document).ready(function(){ 
    kab=<?php echo json_encode($kab); ?> 
}); 
</script> 
<select class="form-control kecamatan" name = "kecamatan" id="kecamatan"> 

</select> 
+0

JavaScript的工作正常,但我正在尋找代碼傳遞**的價值**首先選擇**並更改**第二選擇**取決於我選擇**第一選擇**(看看$卡布陣列),我希望你明白我的意思。一路感謝您的快速回復:D – Sandhi 2014-09-01 12:13:08

+0

@Sandhi,我根據您的要求改變了我的答案。 – anwerj 2014-09-01 13:01:09

+0

謝謝@ anwerjunaid..you幫助我out ..但現在我會用** Pragnesh **方法..:D – Sandhi 2014-09-01 17:36:59