Question

我使用ajax进行了一次下拉选择的数据检索，但我希望它能够根据两个下拉选择条件检索数据。如何将两个变量解析为showChoice函数，然后将第二个选项存储在另一个变量中。我将不胜感激任何帮助。

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

然后是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>

Answer 1

你可以这样使用，看看。如果您错过了

，可能需要包含jquery库

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

像这样更新您的代码

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看起来像这样

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

更新

这里是jsfiddle link

<强> UPDATE2

getuser.php

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

?>

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

1 个答案: