AJAX与/ MySQL数据库子集的分页

时间:2014-06-09 20:41:56

标签: php mysql ajax pagination meekro

我有一个使用mysql&的页面meekrodb从数据库中提取信息。结果限制为每页15个&到数据库的字母数字子集 - 在这个例子中,1-3& A-B

我现在想要在点击#goleft或#gort时添加分页,然后它会从数据库中提取正确的项目。

如何调用agax调用pagination.php&将变量$ start传递给它? 不确定一切,如果我有错误的地方,请更正。 不确定$ start,15是否在pagination.php中是正确的

我已经走到这一步了:

主页:

<?php
require_once 'meekrodb.2.2.class.php';
require_once 'dconnect.php';  // database login info
// currently pulling $results from database on initial pg load
$results = DB::query("SELECT substr(theme, 1, 1) as Alphabet, theme, developer, thumb, thumb_lg FROM gallery ORDER BY (CASE Alphabet
  WHEN '1' THEN 1
  WHEN '2' THEN 2
  WHEN '3' THEN 3  
  WHEN 'A' THEN 4
  WHEN 'B' THEN 5
  ELSE 6
  END), theme
  LIMIT 15");
// get count of all relevant items
$tcount = DB::query("SELECT substr(theme, 1, 1) as Alphabet, theme, developer, thumb, thumb_lg FROM gallery ORDER BY (CASE Alphabet
  WHEN '1' THEN 1
  WHEN '2' THEN 2
  WHEN '3' THEN 3  
  WHEN 'A' THEN 4
  WHEN 'B' THEN 5
  ELSE 6
  END), theme");
// get count of all relevant items
$counter = DB::count();
$ipp = 15;  // items per page
$tpages = ceil($counter / $ipp);  // total pages

// write each entry to specific div;
$x = 0;
foreach ($results as $row) {
  $x++;
  if ($x == 1) {
    $t1 = $row['theme'];
    $d1 = $row['developer'];
    $th1 = $row['thumb'];
    $thlg1 = $row['thumb_lg'];
  }
  ... Additional if's through 15th item
}
?>

Basic Html:

<img src="<?php echo($th1); ?>" data-retina="<?php echo($thlg1); ?>" alt="<?php echo($t1); ?>" />
<span><p class="hname"><?php echo($t1); ?></p>
<div class="bull">&bull;</div>
<p class="hdev"><?php echo($d1); ?></p></span>
...
<div id="thumbnav"><div id="goleft"></div><div id="gort"></div></div>

主要的jg jQuery:

// Previous button
var curpg = 1;
$('#goleft').mouseup (function() {
  var newpg = curpg - 1;
  if (newpg == 0) {newpg = 1} // reset page if going back to first page
  curpg = newpg;
  var $start = (newpg - 1) * 15 + 1;
  // how to pass $start to pagination.php ??
});

// Next button
$('#gort').mouseup (function() {
  var newpg = curpg + 1;
  var $totpgs = <?php echo $tpages; ?>;  // DOESN'T Echo anything !!!
  console.log('Total Pages: ' + $totpgs);
  if (newpg > $totpgs) {newpg = $totpgs}  // limit page to total pages
  curpg = newpg;
  var $start = (newpg - 1) * 15 + 1;
  console.log('Start: ' + $start);
  // how to pass $start to pagination.php ??
});

Pagination.php:

<?php
require_once 'meekrodb.2.2.class.php';
require_once 'dconnect.php';  // database login info
// pull from database using specific page items
$results = DB::query("SELECT substr(theme, 1, 1) as Alphabet, theme, developer, thumb, thumb_lg FROM gallery ORDER BY (CASE Alphabet
  WHEN '1' THEN 1
  WHEN '2' THEN 2
  WHEN '3' THEN 3  
  WHEN 'A' THEN 4
  WHEN 'B' THEN 5
  ELSE 6
  END), theme
  LIMIT $start,15");
?>

更新1: Pagination.php

<?php
$start = $_POST['start'];  // capture input from AJAX
require_once 'meekrodb.2.2.class.php';
require_once 'dconnect.php';
// pull from database using specific page items
$navresults = DB::query("SELECT substr(theme, 1, 1) as Alphabet, theme, developer, thumb, thumb_lg FROM gallery ORDER BY (CASE Alphabet
  WHEN '1' THEN 1
  WHEN '2' THEN 2
  WHEN '3' THEN 3  
  WHEN 'A' THEN 4
  WHEN 'B' THEN 5
  ELSE 6
  END), theme
  LIMIT $start,15");
$x = 0;
foreach ($navresults as $row) {
  $x++;
  if ($x == 1) {
    $t1 = $row['theme'];
    $d1 = $row['developer'];
    $th1 = $row['thumb'];
    $thlg1 = $row['thumb_lg'];
  }
  ... up to 15th variable set
}

主要jQuery:

//Next pagination
$('#gort').mouseup (function() {
  var newpg = curpg + 1;
  var $totpgs = <?php echo $tpages; ?>; // Doesn't show echo !!!
  console.log('Total Pages: ' + $totpgs);
  if (newpg > $totpgs) {newpg = $totpgs}  // limit page to total pages
  curpg = newpg;
  var $start = (newpg - 1) * 15 + 1;
  console.log('Start: ' + $start);
  $.ajax({
    url:'pagination.php',
    type:'POST',
    data:{start:$start},
    dataType:'text'
  });
});

1 个答案:

答案 0 :(得分:0)

你需要对pagination.php进行ajax调用

$('#goleft').mouseup (function() {
    var newpg = curpg - 1;
    if (newpg == 0) {newpg = 1} // reset page if going back to first page
    curpg = newpg;
    var $start = (newpg - 1) * 15 + 1;
    $.ajax({
        url:'pagination.php',
        type:'POST',
        data:{start:$start},
        dataType:'json'
    }).done(function(response) {
        tableparser(response);
    });
});

所以,你看,现在你需要一个函数(我命名为tableparser)来解析JSON并填充你的HTML表。

同时,您需要使用pagination.php脚本来回答有效的JSON

<?php
$start = $_POST['start'] // I'm capturing the input sent from Ajax
require_once 'meekrodb.2.2.class.php';
require_once 'dconnect.php';  // database login info
// pull from database using specific page items
$results = DB::query("SELECT substr(theme, 1, 1) as Alphabet, theme, developer, thumb, thumb_lg FROM gallery ORDER BY (CASE Alphabet
  WHEN '1' THEN 1
  WHEN '2' THEN 2
  WHEN '3' THEN 3  
  WHEN 'A' THEN 4
  WHEN 'B' THEN 5
  ELSE 6
  END), theme
  LIMIT $start,15");

echo json_encode($results);

我不知道您的数据库查询的具体实现,但是一旦您在数组中得到结果,您需要输出json_encoded以获取jQuery以将它们作为对象接收。