MySQL,PHP,Ajax来过滤结果集?

时间:2011-07-14 11:26:52

标签: php jquery mysql ajax

我是MySQL&想按区域“过滤”结果集。我之前曾问过一个类似的问题,但我不知道我是想创建一个新问题还是继续那个问题,对不起,如果我错了。

我看过http://www.w3schools.com/ajax/tryit.asp?filename=tryajax_database&认为这将是理想的,但我不知道如何使它工作,或我如何让它“更新”结果。

理想情况下,我认为该地区下方的下拉框看起来很整洁 - 但是,我没有取得任何成功 - 我真的完全受限于我的理解,任何人都可以帮忙吗? (感谢以前帮助过第一部分的人们!)

这就是我到目前为止所做的一切,(想要了解我想要过滤的内容)。

非常感谢scotia - 下面是regionbox.php文件

...

   <script type="text/javascript">
function selectRegion(str)
{
var xmlhttp;    
if (str=="")
  {
  document.getElementById("region").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("region").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","regionbox.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>

<P>
<table class="dbTable">
    <tr>
    <tr><th>Commodity</th> <th><form action="regionbox.php"> 
<select name="region" onchange="selectRegion(this.value)">
<option value="">Select Region</option>
<option value="E. Midlands">E. Midlands</option>
<option value="Gtr. London">Gtr. London</option>
<option value="North East">North East</option>
<option value="North West">North West</option>
<option value="Scotland">Scotland</option>
<option value="South East">South East</option>
<option value="South West">South West</option>
<option value="W. Midlands">W. Midlands</option>
<option value="Wales">Wales</option>
</select>
</form></th> <th>Member</th> <th>Size</th> <th>Price</th> <th>Date Posted</th>
    </tr>

<?php
$link = mysql_connect('localhost', '', '');

$db_selected = mysql_select_db('palegall_newTrader', $link);
if (!$db_selected) {
    die ('cant find newTrader' . mysql_error());
}

$region = mysql_real_escape_string($_POST['region']);
    $query = mysql_query("SELECT * FROM `sell` WHERE `commodity` = 'paper' ORDER BY `price`") 
       or die( mysql_error() ); 

    echo '<table class="dbTable">';

     while ($row = mysql_fetch_assoc($query))  
    { 

      echo '<tr><td>'.$row['commodity'].'</td> <td>'.$row['region'].'</td> <td>'.
                      $row['member'].'</td> <td>'.$row['size'].'</td> <td>'.
                      $row['price'].'</td> <td>'.$row['posted'].'</td> </tr>'; 
    }
    echo "</table>"; 
    ?> 
</body></html>

我已经剥离了一些东西。我希望这没关系。

2 个答案:

答案 0 :(得分:3)

更改此代码

$query = mysql_query("SELECT * FROM `sell` WHERE `commodity`='Paper' 
                      ORDER BY `price`") 
   or die( mysql_error() ); 
$row=mysql_fetch_assoc($query);  
do 
{ 
  echo'<table class="dbTable">'; 
  echo '<tr><td>'.$row['commodity'].'</td> <td>'.$row['region'].'</td> <td>'.
                  $row['member'].'</td> <td>'.$row['size'].'</td> <td>'.
                  $row['price'].'</td> <td>'.$row['posted'].'</td> </tr>'; 
}
while($row = mysql_fetch_assoc($query)); 
  echo "</table>"; ?> 

进入:

$region = mysql_real_escape_string($_POST['region_Name']);
//For debugging: 
echo $region
$query = mysql_query("SELECT * FROM sell WHERE commodity = 'paper' 
                      AND region = '$region' ORDER BY price") 
   or die( mysql_error() ); 

echo '<table class="dbTable">';

//echo the rows in a while loop
while ($row = mysql_fetch_assoc($query))  
{ 

  echo '<tr><td>'.$row['commodity'].'</td> <td>'.$row['region'].'</td> <td>'.
                  $row['member'].'</td> <td>'.$row['size'].'</td> <td>'.
                  $row['price'].'</td> <td>'.$row['posted'].'</td> </tr>'; 
}
echo "</table>"; 
?> 

答案 1 :(得分:3)

好的,既然你没有回答我会放一个我经常使用的小脚本并且效果很好。

它需要jQuery才能出现在您的网站中

$('select').change(function(){
var region  = $(this).val();
    $("tr").each(function () {
        if ($(this).text().search(new RegExp(region, "i")) < 0) {
            $(this).hide();
        } else {
            $(this).show();
        }
    });
});

您可能会在此处看到http://jsfiddle.net/6psNF/1/

你应该调整你的表代码,例如table可以有一个ID,带代码的行可以有一个类。带有小例子的微小代码:

<table id="trader">
<tbody>
<tr>
    <td>Random</td>
    <td class="region">E. Midlands</td>
    <td>Member</td>
    <td>Size</td>
    <td>Price</td>
    <td>Date</td>
    <td>Posted</td>
</tr>
</tbody>

所以,我写的代码可能会像

那样结束
$('select').change(function(){
var region  = $(this).val();
    $("#trader tr").each(function () {
        if ($(this).text().find(".region").search(new RegExp(region, "i")) < 0) {
            $(this).hide();
        } else {
            $(this).show();
        }
    });
});

在包含大量内容或超大表的页面中提高性能!