Question

我使用无限滚动构建搜索功能。如何从搜索页面到查询数据库的滚动页面获取搜索字符串。

PHP：

的search.php

<head>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="style/css/scroll.css"/>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <link href="css/search.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <div id="search">
        <form action="search" method="post">
            <input type="text" name="search" id="search" autocomplete="off">
            <button type="submit" class="btn btn-primary">Search</button>
        </form>
    </div>
        <img id='loading' src='img/loading.gif'>
        <div id="demoajax" cellspacing="0">
        </div>
</body>
    <script type="text/javascript" src="js/infinitescroll/search.js"></script>

scroll.php

<?php 
include('db.php');

$searchstring = $_POST['search'];

if(isset($_REQUEST['actionfunction']) && $_REQUEST['actionfunction']!=''){ 
     $actionfunction = $_REQUEST['actionfunction'];
     call_user_func($actionfunction,$_REQUEST,$con,$limit);
}
     function showData($data,$con,$limit){
     $page = $data['page'];
     if($page==1){
     $start = 0;
}
else{
    $start = ($page-1)*$limit;
}
    $sql = "SELECT fm_product.p_name, fm_product.p_descp, fm_product.p_id, fm_product.p_price, fm_product.p_discount, fm_product.p_img, fm_member.member_display_name, fm_product.p_member_id, fm_package.package_name, fm_package.package_id FROM fm_member LEFT JOIN fm_product ON fm_member.member_id = fm_product.p_member_id LEFT JOIN fm_package ON fm_member.package_id = fm_package.package_id order by p_created_date desc limit $start,$limit";
$str='';
$data = $con->query($sql);
if($data!=null && $data->num_rows>0) {
    while( $row = $data->fetch_array(MYSQLI_ASSOC)){
    if($row['package_id']=='1'){
        $package = "No Package";
    } else {
        $package = "<form class='form-item'><input name='product_code' type='hidden' value='".$row['p_id']."'><button type='submit'>Add to Cart</button></input></form>";
    }
    $id = $row['p_id'];
    $str.="<div style=align: center class='data-container'><a href=item?id = $id><img src=upload/".$row['p_img']." width=300px style=max-width:100%; height: auto; vertical-align: middle></a><p>By ".$row['member_display_name']."</p><p>Product Name : ".$row['p_name']."</p><p>Price : ".$row['p_price']."</p><p>Discount : ".$row['p_discount']."</p><p>Description : ".$row['p_descp']."</p><p>Package ".$_POST['search']." : ".$row['package_name']."</p><p>".$package."</p></div>";
    }
    $str.="<input type='hidden' class='nextpage' value='".($page+1)."'><input type='hidden' class='isload' value='true'>";
} else {
  $str .= "<input type='hidden' class='isload' value='false'><p>Finished</p>";
}
echo $str;
} 
?>

Javascript：

search.js

 var ajax_arry=[];
 var ajax_index =0;
 var sctp = 100;
 $(function(){
   $('#loading').show();
 $.ajax({
     url:"scroll.php",
              type:"POST",
              data:"actionfunction=showData&page=1",
    cache: false,
    success: function(response){
       $('#loading').hide();
      $('#demoajax').html(response);

    }

   });
$(window).scroll(function(){

   var height = $('#demoajax').height();
   var scroll_top = $(this).scrollTop();
   if(ajax_arry.length>0){
   $('#loading').hide();
   for(var i=0;i<ajax_arry.length;i++){
     ajax_arry[i].abort();
   }
}
   var page = $('#demoajax').find('.nextpage').val();
   var isload = $('#demoajax').find('.isload').val();

     if ((($(window).scrollTop()+document.body.clientHeight)==$(window).height()) && isload=='true'){
       $('#loading').show();
   var ajaxreq = $.ajax({
     url:"scroll.php",
              type:"POST",
              data:"actionfunction=showData&page="+page,
    cache: false,
    success: function(response){
       $('#demoajax').find('.nextpage').remove();
       $('#demoajax').find('.isload').remove();
       $('#loading').hide();

      $('#demoajax').append(response);

    }

   });
   ajax_arry[ajax_index++]= ajaxreq;

   }
return false;

if($(window).scrollTop() == $(window).height()) {
   alert("bottom!");
}
});

});

我希望$_POST['search']从search.php转到scroll.php，将其替换为WHERE，例如。{/ p>

$sql = "SELECT ... FROM ... LEFT JOIN ... ON ... LEFT JOIN ... ON ... WHERE p_name LIKE '%$_POST['search']' ORDER BY ... LIMIT ..."

赞赏。

Answer 1

<form action="search" method="post">

这会重定向到您不具备的/search页面。您有/search.php和/scroll.php。我认为您应该将scroll.php作为操作，并获得结果。

<form action="scroll.php" method="post">

编辑：
我似乎误解了代码。 scroll.php是此中的API端点。然后行动仍然是search.php，但是，为了获得提交的值，你可以用1石头杀死2只鸟。

更新表格HTML（您不需要采取行动，也不需要表格，但让我们保留）：

<form action="" method="post">
    <input type="text" name="search" id="search" autocomplete="off">
    <button type="button" id="do_search" class="btn btn-primary">Search</button>
</form>

在你的JS中，让函数由搜索触发：

jQuery(document).ready(function($) {
    $("#do_search").on("click", function() {
        var searchTerm = $("#search").val();

        //this is where you do the AJAX stuff. You can use searchTerm variable.
    });
});

从PHP获取$ _POST到Javascript并将其传递给另一个PHP

1 个答案: