如何從下拉列表中獲取所選值並將其粘貼到SQL查詢

Question

我有兩個下拉列表框，第一個是銷售區域包含從cookie獲取的不同種類的字母，第二個下拉人員名稱是根據從第一個下拉列表中選擇的值來更改的。 如何管理將選定的選項值傳遞給我的sql查詢，以便可以根據選定的銷售區域進行更改。 這是我想要獲得的結果，我將代碼插入到代碼段中可以輕松進行編輯和演示。

 function fetch_select(val) { $.ajax({ type: 'post', url: 'updateleave.php', data: { get_option:val }, success: function (response) { document.getElementById("slct2").innerHTML=response; } }); 

 <table > <tr> <td> Sales Area <select name="Area" id="area" > <?php $sarea = explode(",",$_COOKIE['cooAreaCode']); foreach($sarea as $item){ ?> <option value="<?php echo strtolower($item); ?>"><?php echo $item; ?></option> <?php } ?> </select > </td> <? $var = $_POST['Area']; $sql = "SELECT StaffName FROM tblStaff WHERE AreaCode= '$var'"; $rs = odbc_exec($link,$sql); while ($row = odbc_fetch_array($rs)) { $porr[] = $row; } odbc_free_result($rs); odbc_close($link); ?> <td> Staff Name <select id="slct2"> ?> </select> </td> <label class="form_field">Your selected <span id="aggregator_name"></span></label> 

（updateleave.php）

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

$ item = $ _ POST ['get_option'];

  $sql = "SELECT  StaffName FROM tblStaff WHERE AreaCode= '$item'";
  $rs = odbc_exec($link,$sql);
 while ($row = odbc_fetch_array($rs)) {
     $porr[] = $row;
   }
    for($i=0; $i < count($porr);$i++) {
   echo "<option  value="strtolower($porr[$i]['StaffName']);" >" .$porr[$i]['StaffName']."</option>";
  odbc_free_result($rs);   
 odbc_close($link); 
    }
?>

Answer 1

我不是jQuery的狂熱者，因此您需要將Javascript轉換為您的需要，但是您需要的是捕獲第一個下拉列表的onchange事件，並使用它動態處理第二個下拉列表的SQL。

<script>
document.getElementById('area').onclick = function(){
    var xmlhttp;
    var formData = new FormData();
    formData.append('area_value', this.value);
    if(window.XMLHttpRequest){
            xmlhttp=new XMLHttpRequest();
    } else {
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function(){
            if(xmlhttp.readyState==4 && xmlhttp.status==200){
alert(xmlhttp.responseText); // for DEBUGGING.
                    if(xmlhttp.responseText == 'false'){
                            alert(xmlhttp.responseText);
                    } else {
                            document.getElementById('slct2').innerHTML = xmlhttp.responseText;
                    }
            }
    }
    xmlhttp.open("POST", 'build_slct2.php');
    xmlhttp.send(formData);
    xmlhttp.onerror = function () { console.error(xmlhttp.statusText); }
}
</script>

build_slct2.php腳本將使用$_POST['area_value']創建所需的SQL查詢，處理該查詢並構建<option></option>列表，該列表最終將顯示在slct2下拉列表中。 build_slct2.php文件將僅echo顯slct2的新內容。

Answer 2

使用append在select標記中添加選項標記也可以完成第一個下拉菜單（“ #area”）的更改事件中的所有工作

$(document).ready(function(){
$("#area").change(function()
{
var val =$(this).val();
 $.ajax({
 type: 'post',
 url: 'updateleave.php',
 data: {
  get_option:val
 },
 success: function (response) {
$("#clct2").append(response);
}
 });
});
});