ボタンクリック時に追加するデータベースデータがドロップダウンに埋め込まれました

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のコードは次のとおりです。

EDIT：

$(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

さて、あなたは$row['companyName']の値（あなたのforeachループ内の1）

からechoに必要なもう一つの実装は次のようになります...あなたが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>