下拉式填充數據庫數據，添加按鈕點擊

Question

我很困惑如何填充我的下拉列表，添加按鈕點擊數據庫值。我使用jQuery做按鈕點擊下拉的添加功能。但它似乎不能填充我的jQuery中的選擇標記與數據庫值的選項。請幫我...

這是我的PHP頁面

 <?php include("connect.php"); 
     $smt = $conn->prepare('select CompanyName From Company'); 
     $smt->execute(); 
     $data = $smt->fetchAll(); 
     ?> 

     <div class="form-group" id='TextBoxesGroup'> 
      <label for="layer" class="col-sm-3 control-label">Layer</label> 
      <div id="TextBoxDiv1" class="col-sm-6"> 
       <select class="form-control" id='textbox1' name="company" placeholder="Company" > 

       <?php foreach ($data as $row): ?> 
        <option><?=$row["CompanyName"]?></option> 
       <?php endforeach ?> 

       </select> 
      </div><hr/> 

      </div> 

      <div class="form-group" > 
      <div class="col-md-9 text-right">     
       <input type='button' class="btn btn-default" value='Add +' id='addButton'> 
      </div> 
      </div> 

用於按鈕點擊添加下拉jQuery的代碼是：

編輯：

$(document).ready(function(){ 

    var counter = 2; 

    $("#addButton").click(function() { 

    if(counter>5){ 
     alert("Only 5 Layers allowed"); 
     return false; 
    } 
    var companies = [<?php echo "'".join("','",$data)."'";?>]; 
    var newTextBoxDiv = $(document.createElement('div')) 
    .attr("id", 'TextBoxDiv' + counter); 

    newTextBoxDiv.after().html('<div class="form-group" id="TextBoxesGroup"><label class="col-sm-3 control-label">Layer '+ counter + ' : </label>' +' <div id="TextBoxDiv1" class="col-sm-6"><select class="form-control" name="textbox' + counter + '" id="textbox' + counter + '" name="company" placeholder="Company">'); 

$.each(companies, function(key, value){ 
    newTextBoxDiv.append('<option>'+value+'</option>'); 
}); 

newTextBoxDiv.append('</select> </div></div>'); 
newTextBoxDiv.appendTo("#TextBoxesGroup"); 
counter++; 
    }); 

}); 

</script> 

但輸出顯示如下： 謝謝

Answer 1

那麼，你需要echo出$row['companyName']值（你的foreach循環裏面的一個）

另一個實現是......說你有值在PHP的數組。

$data = array("company A", "company B", "company C");

和JavaScript ...

<script> 
var companies = [ <?php echo "'". join("','", $data) . "'";?> ]; 
//This generates : ['company A', 'company B', 'company c']; 

function insertOptions() 
{ 
    $.each(companies, function(key, value){ 
     $("#IDofSelectTag").append("<option>"+value+"</option>"); 
    }); 
} 
</script>