在動態的div

Question

顯示一個下拉我有一個地址div其中包含3個元素：地址（文本區域），城市（下拉），局部性（下拉）。
我們有一個+按鈕下方添加現有的同一div它獲取動態創建。現在在動態div中，如何在城市下拉菜單中調用數據庫值，並且地點是否取決於城市的下拉菜單？ 雖然這方面的工作，我能創造一個新的地址（文本區域），而不是下拉列表，以便任何人都可以幫助我在這裏？

 <script> 
      $(document).ready(function() { 
var counter = 0; 
$("#addButton").click(function() { 
     if (counter > 100) { 
      alert("Only 100 Address allowed"); 
      return false; 
     } 


    var elems = '<div class="col-lg-5" id="Address' + counter + '">'+ 
      '<textarea class="form-control" name="alt_address[]" rows="3" placeholder="Address' + (counter+1) + '" /></div>' + 
      '<div class="col-lg-1 form-group">'+ 
      '<button type="button" class="removebtn" id="removeButton' + counter + '">' + 
      '<span class="glyphicon glyphicon-minus"></span></button>' + 
      '</div><div class="col-lg-6 form-group col-lg-offset-6"> </div>' + 
      '<div class="col-lg-3 form-group" id="city' + counter +'"></div><div class="col-lg-3 form-group" id="locality' + counter +'"></div><div class="col-lg-6 col-lg-offset-6"></div>'; 


     counter++; 
     return false; 



       }); 

       $(document).on('click','.removebtn',function() { 

       if(counter==0){ 
     alert("No more textbox to remove"); 
     return false; 
    } 

counter--; 

    $("#Address" + counter).remove(); 
    $("#removeButton" + counter).remove(); 


}); 

}）;

HTML：

    <button type="button" class="btn btn-default btn-sm" id="addButton"> 
        <span class="glyphicon glyphicon-plus"></span> 
       </button> 
      </div> 
      <div class="col-lg-6 form-group col-lg-offset-6"> 
      </div> 

       <div class="col-lg-6 form-group col-lg-offset-6"> 
      </div> 

      <div class="col-lg-3 form-group"> 
       <select name="city_name" id="city_name" class="form-control" required> 
        <option value="" selected="selected">Select city</option> 
     <?php 
     $sql="select * from city"; 

        $res=mysqli_query($con,$sql); 

        while($row=mysqli_fetch_array($res)) 

      { 

        echo "<option value='$row[city_id]'>$row[city_name]</option>"; 
        } 
        ?> 

       </select> 
      </div> 
      <div class="col-lg-3 form-group"> 
       <select name="locality_name" id="locality_name" class="form-control" required> 
        <option value="" selected="selected" >Select Locality</option> 

     </select> 
     </div> 
     <div class="col-lg-6 col-lg-offset-6"> 
     </div> 


      </div> 

      <div class="col-lg-6 form-group col-lg-offset-6"> 
      </div> 

      <div class="col-lg-5" id='TextBoxesGroup'> 


      </div> 

       <!---Address--> 

Answer 1

$city_name = array(); 
    $city_id = array(); 

    while($row=mysqli_fetch_array($res)) 
    { 
     array_push($city_id,$row[city_id]); 
     array_push($city_name,$row[city_name]); 
    } 

    $count = count($city_id); 

現在，你有不同的陣列中city_id和CITY_NAME。 現在在javascript中循環它們。

<script> 

    var city_id = '<?php echo json_encode($city_id); ?>'; 
    var city_name = '<?php echo json_encode($city_id); ?>'; 

    var count = '<?php echo $count; ?>' 

    for(var k=0;k<count;k++){ 

     // Add options here. 
    } 
    </script>