Php 使用复选框筛选jQuery ListView_Php_Jquery

Php 使用复选框筛选jQuery ListView

php jquery

Php 使用复选框筛选jQuery ListView,php,jquery,Php,Jquery,我有一个jQuery ListView，它从php文件加载数据。我还有一个复选框，onclick应该能够过滤列表。过滤是通过向服务器发送post消息并刷新列表来完成的。但是，复选框列表不会过滤列表。下面的代码只是整个实现的一部分。以下是网页：这是HTML实现： <head> <script> lastRecord=0; function loadRest(){ $('#sample').html( 'hello' ); $

我有一个jQuery ListView，它从php文件加载数据。我还有一个复选框，onclick应该能够过滤列表。过滤是通过向服务器发送post消息并刷新列表来完成的。但是，复选框列表不会过滤列表。下面的代码只是整个实现的一部分。以下是网页：

这是HTML实现：

<head>
<script>
lastRecord=0;
       function loadRest(){
        $('#sample').html( 'hello' );
        $.get( 
        "queryRestaurantsList.php?lastRecord="+lastRecord,
        function( data ) {
            $('#rest_mesgs').append( data )
            .listview( 'refresh' );
        }
    );
}
</script>
</head>

<body onload="loadRest()">
<div data-demo-html="true">                
<form>
<fieldset data-role="controlgroup" data-type="horizontal">
<legend>Select your type of Restaurant:</legend>
<input type="checkbox" name="checkbox-h-2a" id="checkbox-h-2a" onchange="onfilter()" value="Vegetarian"/>
<label for="checkbox-h-2a">Vegetarian</label>
</fieldset>
</form>
</div>

<div data-demo-html="true">
<ul data-role="listview" data-theme="a" data-split-theme="b" data-split-icon="plus" data-inset="true" id="rest_mesgs">
<li data-role="list-divider">Restaurants</li>   
</ul>
</div>

<script>    
function onfilter(){
 if($("#checkbox-h-2a").prop('checked')){
     document.getElementById("hehe").innerHTML = "if condition is true";
 var a = document.getElementById("checkbox-h-2a");
 $.post("queryRestaurantsList.php",
    {
    filter0 : a.value;
    },
    function(data){
    $('#rest_mesgs').append( data )
    .listview( 'refresh' );
    });
}
    else {
         document.getElementById("hehe").innerHTML = "not working";
    }   
    }
</script>
</body>

这是php文件：

mysql_connect($host,$username,$password);
mysql_select_db($database) or die( "Unable to select database");

//Check if POST array is empty or not

if ($_POST == null){

$query = "SELECT Name,Short_Loc,Image_Link,Type FROM Restaurant_Info"; 

$result = mysql_query($query) or die( "Unable to execute query");

while ($row = mysql_fetch_array($result)){
        print '<li>';   
        print '<a href="'.$row['Full_Link'].'">';
        print '<img style="height:80px;" src="'.$row['Image_Link'].'">';
        print '<h2 style="text-wrap : normal">'.$row['Name'].'</h2>';
        print '<p id="type" class="ui-li-aside"><strong>'.$row['Type'].'</strong></p>';
        print '<p>'.$row['Short_Loc'].'</p>';
        print '</a>';
        print '</li>';
        }
}

else {

    $value1 = $_POST[filter0];

    $query0 = 'SELECT Name,Short_Loc,Image_Link FROM Restaurant_Info WHERE Type LIKE ';
    $query0 = $query0.'"%'.$value1.'%"';
$result = mysql_query($query0) or die( "Unable to execute query");
$num_results = mysql_num_rows($result); 

if ($num_results == 0){
    print "Your criteria does not match any of the restaurants";
}

else{
    while($row = mysql_fetch_array($result)) {
    print '<li>';   
    print '<a href="'.$row['Full_Link'].'">';
    print '<img style="height:80px;" src="'.$row['Image_Link'].'">';
    print '<h2 style="text-wrap : normal">'.$row['Name'].'</h2>';
    print '<p>'.$row['Short_Loc'].'</p>';
    print '</a>';
    print '</li>';
}
}

我可以看到2个错误，但不幸的是我无法测试它们

1-此php部分：

else {

$value1 = $_POST[filter0];

应替换为：

else {

$value1 = $_POST['filter0'];

否则，filter0将被视为常量而不是字符串

2-在html上，您执行了以下操作：

<input type="checkbox" name="checkbox-h-2a" id="checkbox-h-2a" onchange="onfilter()" value="Vegetarian"/>

这应该是

<input type="checkbox" name="checkbox-h-2a" id="checkbox-h-2a" onclick="onfilter()" value="Vegetarian"/>

我认为当你勾选或取消勾选复选框时，复选框不会在一次更改时触发。

1。要维护复选框状态更改，请使用jQuery.toggle。这是最安全的方法

$("#checkbox-h-2a").toggle(function(){
    var filter = $(this).val();
    getListviewItems({filter0: filter});
}, function() {
    getListviewItems();
});

二,。制作一个带有参数的函数，用于获取列表项。这样，您将保持代码干净，易于维护

function getListviewItems(opt) {
    opt.filter0 = (opt.filter0 == undefined)?'':opt.filter0;
    /* Body of function, post and/or get calls, etc. */
}

您的代码存在sql注入的严重漏洞。我建议您使用参数化查询并尽快解决此问题。@Esa是的，谢谢您指出。您的问题是什么？@user3558931。复选框列表未筛选列表。这是否可以解决问题？