Ajax从第二个选择和数据库中提取信息

时间:2013-08-16 13:02:00

标签: php javascript mysql ajax

我希望有多个下拉列表在数据库中执行搜索,并在网页上的表格中回显信息。

从教程我已经管理了这个,但只有一个选择。我正在努力使第二个下拉列表改进搜索条件。

  • 下拉列表1应该是在数据库中搜索所选值的选项。

  • 下拉列表2应该向sql添加AND条件,并使用第二个值来优化搜索。

以下代码在更改时不会从数据库中提取任何信息。如果我删除AND语句,它将从数据库中提取信息。

HTML:

<!DOCTYPE html>
<html>

<head>

  <title> Vault of Faults-Fault Search </title>

    <link rel="stylesheet" type="text/css" href="mystyle1.css">

      <script src="dropdownfix1.js"></script>

</head>

<body>

  <div id=container>

    <div id=header>
        <div id=headdiv>


          <form id=login name="login" action="login.php" method="post">
                  <fieldset class="field_set">
                  <legend>Administrator Login:</legend> <!-- legeng tage creates a header title for the fieldset box, filedset pulls all data in the tag to gether with a box around it. -->

                  UserName: <input type="text" name="username"> <br>

                  Password:<br> <input type="password" name="password"> <br>

                  <input type="submit" value="Login"> <input type="Button" onClick="parent.location='addafix.php'" Value="Add a Fix">


                  </fieldset>
                  </form>


        </div>
    </div>

      <div id=content>
        <div id=maincontent>

        <div id=select>
    <form>
        <fieldset class="field_set2">
        <legend>Quicklink Vault of Faults Search</legend>
      Product:



    <select name="Product" onchange="showUser(this.value)">

      <option value="0">Select Product</option>
      <option value="1">Merlin</option>
      <option value="2">Encoder</option>
      <option value="3">Mac Live</option>
      <option value="4">Windows Live</option>
      <option value="5">Windows S&F</option>
      <option value="6">Mac S&F</option>
      </select>

      <select name="Product_Issue" onchange="showIssue(this.value)">

      <option value="0">Select Issue</option>
      <option value="1">Preview</option>
      <option value="2">Live Reciever</option>
      <option value="3">Mac Live</option>
      <option value="4">Windows Live</option>
      <option value="5">Windows S&F</option>
      <option value="6">Mac S&F</option>
      </select>






      <input type="submit" value="Search">
      </fieldset>
  </form>


  </div>
          <div id=list>
          <div id="txtHint"><b>Person info will be listed here.</b></div> 
          </div>
        </div>



      </div>



  </div>




</body>

</html> 

JavaScript的:

function showUser(str)
{
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  } 
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();
}


function showIssue(str)
{
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  } 
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?p="+str,true);
xmlhttp.send();
}

PHP:

<?php

$q=$_GET["q"];
$p=$_GET["p"];                      
require 'connection.php';
mysqli_select_db($con,"Faults" );

//where statement in the sql syntax will select where in db to get infor, use AND to add another condition
$sql="SELECT Products.Product_Name, Versions.Version, Platform.Platform_Name, Issues.Issue, Issues.Sub_Issue, Issues.Fix
FROM Solutions INNER JOIN Products ON Solutions.Product = Products.Product_id
INNER JOIN Versions ON Solutions.Product_Version = Versions.Version_id
INNER JOIN Platform ON Solutions.Product_Platform = Platform.Platform_id
INNER JOIN Issues ON Solutions.Product_Issue = Issues.Issue_id
WHERE Product = '".$q."' AND Product_Issue = '".$p."'";




$result = mysqli_query($con,$sql);


//below is the echo statment to create the results in a table format, list collumn titles
echo "<table id=tables border='1'> 
<tr>
<th>Products</th>
<th>Version</th>
<th>Platform</th>
<th>Issue</th>
<th>Sub Issue</th>
<th>Fix</th>



</tr>";

//below is script to list reults in a table format, $row [row name on table] 

while($row = mysqli_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['Product_Name'] . "</td>";
echo "<td>" . $row['Version'] . "</td>";
echo "<td>" . $row['Platform_Name'] . "</td>";
echo "<td>" . $row['Issue'] . "</td>";
echo "<td>" . $row['Sub_Issue'] . "</td>";
echo "<td><a href=\"idfix.php?Fix=" . nl2br($row['Fix']) . "\">Fix</a></td>";
echo "</tr>";

}

echo "</table>";

// below closes the coonection to mysql


?>

1 个答案:

答案 0 :(得分:0)

我认为您需要连接下拉列表的值。类似的东西:

     <script type="text/javascript">
     function server(aform)
     {
     var xmlhttp; 
     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="+ product.value +"&" +"p="+product_i.value ,true);
     xmlhttp.send();
     }
    </script>