【发布时间】：2013-10-31 05:38:51
【问题描述】：
我已经在我的项目 (https://github.com/webcreate/infinite-ajax-scroll) 中实现了infinite-ajax-scroll 插件。它是一个显示一长串 div 的 PHP 项目。无限滚动使用服务器端分页。我也有服务器端过滤和排序，理想情况下希望它使用 Ajax，以便它与我的无限滚动很好地工作。如何使用 Ajax 传递过滤器？我找到了有关如何使用 JQuery 进行过滤的教程，但都没有使用 PHP。
我确实找到了http://isotope.metafizzy.co/，它同时具有过滤和无限滚动功能，但在文档中它建议不要同时使用这两种功能，这对我来说是一个巨大的耻辱，因为它看起来像一个很棒的插件。
任何人都可以就我的最佳方法提出建议吗？如果我需要在选择新过滤器时重置无限滚动，那很好。但是我将如何做到这一点以及如何将选定的过滤器传递给无限滚动？
以下是我目前所拥有的。
$cat = (isset($_GET['cat']) ? urldecode($_GET['cat']) : '');
$page = (int) (!isset($_GET['p'])) ? 1 : $_GET['p'];
$start = ($page * $pagelimit) - $pagelimit;
$limit = $pagelimit*$page;
//get total number of discounts for search
$total_items = Stuff::countItems($cat);
if( $total_items > ($page * $limit) ){
$next = ++$page;
}
//get items
$items = Stuff::getItems($cat, $sortby, $dir, $start, $limit);
if(!$items){
header('HTTP/1.0 404 Not Found');
echo 'Page not found!';
exit();
}
?>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ias.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// Infinite Ajax Scroll configuration
jQuery.ias({
container : '.wrap', // main container where data goes to append
item: '.item', // single items
pagination: '.paginate', // page navigation
next: '.paginate a', // next page selector
loader: '<img src="css/ajax-loader.gif"/>', // loading gif
noneleft: 'No more items', //Contains the message to be displayed when there are no more pages left to load
triggerPageThreshold: 5, // show "load more" if scroll more than this to stop
trigger: "Load more items"
});
});
</script>
</head>
<body>
<div class="wrap">
<?php
echo 'TOTAL: '.$total_items .'<br />';
//filter through categories*/
echo 'FILTER BY CATEGORY:';
foreach ($categories as $category){
$categoryURL = urlencode($category);
echo "<a href=\"index.php?cat=$categoryURL\">$category<a/> | ";
}
//loop through and display items
foreach ($items as $id => $item){
echo "<div style=\"border:1px solid green;margin-bottom:5px;\" class=\"item\" id=\"item-$id\">
ID: $id <br />
$item[name]<br />
$item[cat]<br />
$item[description]<br />
</div>";
}
?>
<!--paginagation-->
<?php if (isset($next)): ?>
<div class="paginate">
<a href='index.php?cat=<?php echo $cat?>&p=<?php echo $next?>'>Next</a>
</div>
<?php endif?>
</div>
</body>
</html>
【问题讨论】：
-
所以您想使用 html/javascript 指定一个过滤器并通过 AJAX 将其提交到您的服务器端脚本，我说对了吗？如果是这样，什么样的过滤器？
-
我也在试图找出其中的哪一部分不适合你。类别应该被过滤——应该是什么没有发生？
-
是的，该类别正在过滤，但仅在重新加载页面后。应用过滤器时，我正在尝试使用 ajax 加载新结果。然后我可能需要重置无限滚动。然后我需要传递选定的过滤器（类别），以便无限滚动与选定的过滤器一起工作。希望澄清一下。
标签： php ajax filtering jquery-isotope infinite-scroll