douling1936 2015-04-04 10:55
浏览 63
已采纳

如何根据两个下拉选择从数据库中检索数据

I've got the data retrieval working for one drop down selection using ajax but i want it to retrieve data based on two drop-down selection conditions. How do i parse two variables to my showChoice function and then store the 2nd choice in another variable. I would appreciate any help.

<html>
  <head>
    <script>
      function showChoice(str) {
        if (str == "") {
          document.getElementById("txtHint").innerHTML = "";
          return;
        } else { 
          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) {
                document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
            }
          }
          xmlhttp.open("GET","getuser.php?q="+str,true);
          xmlhttp.send();
        }
      }
    </script>

  </head>
  <body>

    <form>
      <select name="choices" onchange="showChoice(this.value)">
        <option value="">Select a departure point:</option>
        <option value="London">London</option>
        <option value="New Castle">New Castle</option>
      </select>
    </form>
  </body>
</html>

Then the getuser.php doc

<!DOCTYPE html>
<html>
  <head>
    <style>
    table {
    width: 100%;
    border-collapse: collapse;
    }

    table, td, th {
    border: 1px solid black;
    padding: 5px;
    }

    th {text-align: left;}
    </style>
  </head>
  <body>

    <?php
      $q = $_GET["q"];


      $con = mysqli_connect('localhost','root','','busdb');
      if (!$con) {
        die('Could not connect: ' . mysqli_error($con));
      }

      mysqli_select_db($con,"busdb");
      $sql="SELECT * FROM busRoutes WHERE Departure = '".$q."'";
      $result = mysqli_query($con,$sql);


      echo "<table>
      <tr>
      <th>ID</th>
      <th>Departure</th>
      <th>Destination</th>
      <th>Time</th>

      </tr>";
      while($row = mysqli_fetch_array($result)) {
        echo "<tr>";
        echo "<td>" . $row['ID'] . "</td>";
        echo "<td>" . $row['Departure'] . "</td>";
        echo "<td>" . $row['Destination'] . "</td>";
        echo "<td>" . $row['Time'] . "</td>";
        echo "</tr>";
      }
      echo "</table>";


      mysqli_close($con);
    ?>
  </body>
</html>
  • 写回答

1条回答 默认 最新

  • dongluxin6711 2015-04-04 11:04
    关注

    you can use like this , have a look. may be you need to include jquery library if you missed this 

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

    update your code like this 

    function showChoice(str,sel2) {
if (str == "") {
    document.getElementById("txtHint").innerHTML = "";
    return;
} else { 
    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) {
            document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","getuser.php?q="+str+"&q2="+sel2,true);
    xmlhttp.send();
}
}

$(document).ready(function()
{
    $('.select').change(function()
    {
        var sel1=$('#select1').val();
        var sel2=$('#select2').val();
        showChoice(sel1,sel2);

    })

});

    html will look like this 

    </head>
<body>

<form>
<select id="select1" class="select" name="choices">
<option value="">Select a departure point:</option>
<option value="London">London</option>
<option value="New Castle">New Castle</option>
</select>

<select id="select2" class="select" name="choices2">
<option value="">Select a departure point:</option>
<option value="London">London</option>
<option value="New Castle">New Castle</option>
</select>
</form>
</body>
</html>

    UPDATE

    here is jsfiddle link

    update2

    getuser.php

    <?
echo $q=$_GET['q'];
echo $q2=$_GET['q2'];

?>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题？

悬赏问题

  • ¥15 metadata提取的PDF元数据，如何转换为一个Excel
  • ¥15 关于arduino编程toCharArray()函数的使用
  • ¥100 vc++混合CEF采用CLR方式编译报错
  • ¥15 coze 的插件输入飞书多维表格 app_token 后一直显示错误，如何解决？
  • ¥15 vite+vue3+plyr播放本地public文件夹下视频无法加载
  • ¥15 c#逐行读取txt文本，但是每一行里面数据之间空格数量不同
  • ¥50 如何openEuler 22.03上安装配置drbd
  • ¥20 ING91680C BLE5.3 芯片怎么实现串口收发数据
  • ¥15 无线连接树莓派，无法执行update，如何解决？（相关搜索：软件下载）
  • ¥15 Windows11, backspace, enter, space键失灵