Question

我有一个sql查询，我正在使用php作为一个表回应。

 $query="SELECT Name,
           Location,
           ID,
           Price

         From ProdTable
         where ID>=2300;"

$results = mysql_query($query);

while ($row = mysql_fetch_array($results)) {
    echo '<tr>';

    foreach($row as $field) {
        echo '<td>' . htmlspecialchars($field) . '</td>';
    }

    echo '</tr>';
}

我现在想要做的是能够使用复选框过滤表格（默认情况下显示所有位置，然后允许用户按照他/她的喜好过滤它们），如下所示：

<input type="checkbox" name="location" value="newyork">New York
<input type="checkbox" name="location" value="chicago">Chicago
<input type="checkbox" name="location" value="orlando">Orlando
<input type="checkbox" name="location" value="losangeles">Los Angeles

但我想通过javascript来做到这一点，因此它更具动态性，用户无需按提交即可进行过滤。我知道已经有javascript工具包用于过滤，但我想自己编写一些javascript函数。

非常感谢任何指导。

Answer 1

您可以将phpGrid或jqGrid用于ajax网格。它易于使用。

Answer 2

您可以采用以下基本方法
将复选框值与用户输入的值匹配，并相应地使用javascript设置其（或父 tr ）display none / table-row。

Answer 3

如果你想自己编写函数，here是一个使用jQuery的函数示例，它可以提供帮助：

$('#val1').change(function(){
    if (this.checked){
        $('table tr').each(function(){
            var td = $(this).find('td')
            if(td.html() == 'value1')
                td.show();
        })
    }else{
        $('table tr').each(function(){
            var td = $(this).find('td')
            if(td.html() == 'value1')
                td.hide();
        })
    }
})

注意：这远非好方法，只是必须展示如何解决的样本。

使用javascript过滤表格

3 个答案: