Onchange下拉值查询resp。表 - 用php,mysql,ajax,jquery

时间:2014-01-13 07:20:43

标签: javascript php jquery mysql ajax

主要下拉列表:

<select name="sometest">
  <option value="1"> A </option>
  <option value="2"> B </option>
  <option value="3"> C </option>
  <option value="4"> D </option>
  <option value="5"> E </option>
</select>

现在这里当值1,2,3,4处于变化状态时,它应该从table_1获取其详细信息,当值5处于变化状态时,其详细信息来自另一个带有字段(名称,大小,标题)的table_2。

请注意table_1和table_2都有相同的coloumn字段名称。

现在在改变之后。价值我得到另一个下拉列表与resp。表查询。

假设我在更改1或2或3或4值时,则查询table_1,其中包含字段名称,大小,标题,并在resp下拉部分列出。

下拉列表:来自table_1的1,2,3,4的变化值

此处:coloumn“name”所有值都列在名称下,coloumn“size”所有值都列在size和coloumn“title”下所有值都列在 table_1

的标题下
<select name="name">
  <option value="n1"> Apple </option>
  <option value="n2"> Boy </option>
  <option value="n3"> Cat </option>
</select>

<select name="size">
  <option value="12"> 0-1 </option>
  <option value="21"> 1-1 </option>
</select>


<select name="title">
  <option value="1"> whatever </option>
  <option value="2"> same whatever </option>
</select>

同样,当从主下拉菜单中选择值5 时,它会从 table_2 查询所有列字段,并在resp下列出。下拉

1 个答案:

答案 0 :(得分:1)

用户ajax onchange选择框传递select

的值

HTML

 <select name="sometest" onchange="javascript:call_ajax_fun(this.value);">
      <option value="1"> A </option>
      <option value="2"> B </option>
      <option value="3"> C </option>
      <option value="4"> D </option>
      <option value="5"> E </option>
    </select>

JS Ajax函数

function call_ajax_fun(str)
{

    if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
    }
    else
    {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.onreadystatechange=function()
    {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {

            var result = xmlhttp.responseText;
            if(xmlhttp.responseText!='')
            {
                document.getElementById('your_result_div_id').innerHTML =result ;
                            // put your result in your div 
            }   
        }
    }



    var url="get_result.php?pas_val="str;

    xmlhttp.open("GET",url,true);

    xmlhttp.send();
}

,您的获取结果文件如下

<强> get_result.php

<?php
if(isset($_REQUEST['pas_val']))
{
   $pas_val = $_REQUEST['pas_val'];
   if($pas_val<5)
   {
     $tbl = "table_1";
   }
   else
  {
     $tbl = "table_2";
  }


// your table is in $tbl variable
//   your your table here in your code


}
else
{
  exit;
}
?>