Question

我有两个下拉列表框，第一个是销售区域包含从cookie获取的不同类型的字母表，第二个下拉人员名称是根据从第一个下拉列表中选择的值更改。如何设置将选定的选项值传递给我的SQL查询，以便根据所选的销售区域进行更改。 This is the results that i want to get我将代码插入代码段以便于编辑和演示。

＆＃13;

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

＆＃13;

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

＆＃13;

（updateleave.php）

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

$项= $ _ POST [＆＃39; get_option＆＃39;];

  $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);
}
 });
});
});

如何从下拉列表中获取所选值并将其传递给sql查询

2 个答案: