ドロップダウンの選択に基づいてチェックボックスを設定する

Question

フォームでは、DBからデータを取り込んだ業界のリストがあります。選択した業界に基づいてチェックボックスのリストを作成したいと思います。

私は以下を試みましたが、動作しませんでした。 お手伝いできますか？私はまだコードを学んでおり、あなたの助けに本当に感謝しています。

のindex.php

// The dropdown is populated from DB 
<select class="set_industry"> 
    <option value="1">Healthcare</option> 
    <option value="2">Food & Beverage</option> 
    <option value="3">Real Estate</option> 
</select> 
// Preferably the selection would produce var $ind_id 
. 
. 
. 
. 
// I want the below to be executed based on the selection from above 

<?php 
if(isset($_POST['id'])) { 
    $ind_id = $_POST['id']; 
    $x="SELECT * FROM srv_tbl WHERE ind_id=$ind_id"; 
    $res=query($x); 

    while ($y=mysqli_fetch_array($res)) { ?> 
    <div> 
    <label> 
     <input type="checkbox" value="<?php echo $y['srv_id'] ?>"> <?php echo $y['srv_name'] ?> 
    </label> 
    </div> 
<?php } 
} ?> 

<script>Link to js script</script> 

script.js

$(".set_industry").on('change', function(){ 
    var ind_id = $(this).attr("value"); 
    $.post("index.php", {id: ind_id}, function()); 
}); 

Answer 1

PHPコードを分離します。

のindex.php

<?php 

if(isset($_POST['id'])) { 

    $ind_id = $_POST['id']; 
    $x="SELECT * FROM srv_tbl WHERE ind_id=$ind_id"; 
    $res=query($x); 

    $returnString = ''; 
    while ($y=mysqli_fetch_array($res)) { 

    $returnString .= '<div><label><input type="checkbox" value=".$y['srv_id'].">.$y['srv_name'].</label></div>'; 
    } 

    echo $returnString; 
} ?> 

あなたのHTMLページに新しいdiv要素を追加

index.htmlを

<select class="set_industry"> 
    <option value="1">Healthcare</option> 
    <option value="2">Food & Beverage</option> 
    <option value="3">Real Estate</option> 
</select> 

<div id="response"></div> 

<script>Link to js script</script> 

あなたscript.js

にこれらの変更を行います

$(".set_industry").on('change', function(){ 
    var ind_id = $(this).attr("value"); 
    $.post("index.php", {id: ind_id}, function(data){ 

     $("#response").html(data); 
    }); 
});