处理无限滚动效果Jquery和PHP

时间:2016-02-14 22:52:12

标签: php jquery mysql ajax

为什么我创建的网址是404而不是将页面数据集加载到我想要在滚动上显示的每个组?

我实现了一个无限滚动效果,用于从我的mysql数据库中的表中对我的数据进行分页。现在我正在尝试加载页面,我的查询正在创建的URL收到404错误。

example.com/inventory-search.php?limit=15&offset=0&_=1455489762864 404 (Not Found)

我的印象是,正在形成的网址是指定页面数量,我的逻辑应该跟踪要显示的页面集。在滚动上加载更多。

我确实在网上使用了一个教程来完成这部分逻辑,所以我想知道我是否假设出错了。

我的代码看起来像这样, DB配置       

$db_host = "localhost";
$db_user = "username";
$db_pass = "password";
$db_name = "dbName";

try
{
     $DB_con = new PDO("mysql:host={$db_host};dbname={$db_name}",$db_user,$db_pass);
     $DB_con->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
}
catch(PDOException $exception)
{
     echo $exception->getMessage();
}
?>

广告资源搜索脚本

  <?php
require_once get_stylesheet_directory() . '/wuno-search/Dbconfig.php';

$limit = (intval($_GET['limit']) != 0 ) ? $_GET['limit'] : 15;
$offset = (intval($_GET['offset']) != 0 ) ? $_GET['offset'] : 0;

$sql = "SELECT * FROM wuno_inventory WHERE 1 ORDER BY id ASC LIMIT $limit OFFSET $offset";
try {
  $stmt = $DB_con->prepare($sql);
  $stmt->execute();
  $results = $stmt->fetchAll();
} catch (Exception $ex) {
  echo $ex->getMessage();
}
if (count($results) > 0) {
  foreach ($results as $res) {
    echo '<tr class="invent">';  
    echo '<td>' . $res['wuno_product'] . '</td>';  
    echo '<td>' . $res['wuno_alternates'] . '</td>';  
    echo '<td>' . $res['wuno_description'] . '</td>';  
    echo '<td>' . $res['wuno_onhand'] . '</td>';  
    echo '<td>' . $res['wuno_condition'] . '</td>';  
    echo '</tr>';   
  }
}
?>

我的Jquery

<script type="text/javascript">
jQuery(document).ready(function($) {
var busy = false;
var limit = 15;
var offset = 0;
var assetPath = "<?php echo $assetPath; ?>"

function displayRecords(lim, off) {
  jQuery.ajax({
          type: "GET",
          async: false,
          url: assetPath,
          data: "limit=" + lim + "&offset=" + off,
          cache: false,
          beforeSend: function() {
            $("#loader_message").html("").hide();
            $('#loader_image').show();
          },
          success: function(html) {
            $("#productResults").append(html);
            $('#loader_image').hide();
            if (html == "") {
             $("#loader_message").html('<button data-atr="nodata" class="btn btn-default" type="button">No more records.</button>').show()
            } else {
             $("#loader_message").html('<button class="btn btn-default" type="button">Loading please wait...</button>').show();
            }
            window.busy = false;

          }
        });
}

(function($) {
$(document).ready(function() {
if (busy == false) {
  busy = true;
  // start to load the first set of data
  displayRecords(limit, offset);
}
});
})( jQuery );



(function($) {
$(document).ready(function() {
$(window).scroll(function() {
          // make sure u give the container id of the data to be loaded in.
          if ($(window).scrollTop() + $(window).height() > $("#productResults").height() && !busy) {
            busy = true;
            offset = limit + offset;

            displayRecords(limit, offset);

          }
});
});
})( jQuery );
});
</script>

define $assetPath
$assetPath = get_stylesheet_directory() . '/wuno-search/inventory-search.php';

&GT;

1 个答案:

答案 0 :(得分:0)

有许多因素可能是因素,但可能最大的问题是您正在尝试访问尚未SELECT编辑的结果属性。例如,如果您在查询中仅选择了$res['wuno_product'],则会尝试获取id。您始终可以执行print_r($results)var_dump($results)等查看查询返回的内容。