如何正确地为此分页脚本添加过滤器?

时间:2010-02-09 00:17:11

标签: php jquery mysql pagination

我目前正在处理this tutorial,并希望为其添加一个过滤按钮。

我正在使用jquery使元素可点击:

<p id="marketing">MARKETING</p>

和元素的jquery:

// Sort content Marketing    
$("#pagination p").click(function () {

        Display_Load();

        //Loading Data
        var pageNum = this.id;    

        $("#content").load("filter_marketing.php?page=" + pageNum, Hide_Load());

});

我得到的问题是点击段落标签会转到'filter_marketing.php?page ='但不起作用(即什么都不显示),因为'var pageNum'没有定义。

pageNum的php代码如下所示:

<?php
//Pagination Numbers
for($i=1; $i<=$pages; $i++)
{
echo '<li id="'.$i.'">'.$i.'</li>';
}
?>

我只是不确定如何制作按钮'营销'并点击它进入php页面并在mysql db中获取结果并以分页显示它。

如果有人可以提供帮助,那就太好了。

P.S。检查教程的整个脚本以查看整个结构及其工作原理。 Tutorial

编辑:这是代码:

Pagination.php:

<?php
include('config.php');
$per_page = 3;

//Calculating no of pages
$sql = "select * from explore where category='marketing'";
$result = mysql_query($sql);
$count = mysql_num_rows($result);
$pages = ceil($count/$per_page)
?>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery_pagination.js"></script>

<style>
body { margin: 0; padding: 5; font-family:Verdana; font-size:10px }
a
{
text-decoration:none;
color:#B2b2b2;

}

a:hover
{

color:#DF3D82;
text-decoration:underline;

}
#loading { 
width: 100%; 
position: absolute;
}

#pagination
{
text-align:center;
margin-left:120px;

}
li{ 
list-style: none; 
float: left; 
margin-right: 16px; 
padding:5px; 
border:solid 1px #dddddd;
color:#0063DC; 
}
li:hover
{ 
color:#FF0084; 
cursor: pointer; 
}
td{
border:solid 1px #dddddd;
padding:5px;
}


</style>



<div id="loading" ></div>
<div id="content" ></div>
<ul id="pagination">
<?php
//Pagination Numbers
for($i=1; $i<=$pages; $i++)
{
echo '<li id="'.$i.'">'.$i.'</li>';
}
?>
<p id="marketing">MARKETING</p>
</ul>
<br />
<br />

jquery_pagination.js

$(document).ready(function(){

    //Display Loading Image
    function Display_Load()
    {
        $("#loading").fadeIn(900,0);
        $("#loading").html("<img src='bigLoader.gif' />");
    }
    //Hide Loading Image
    function Hide_Load()
    {
        $("#loading").fadeOut('slow');
    };


   //Default Starting Page Results

    $("#pagination li:first").css({'color' : '#FF0084'}).css({'border' : 'none'});

    Display_Load();

    $("#content").load("pagination_data.php?page=1", Hide_Load());



    //Pagination Click
    $("#pagination li").click(function(){

        Display_Load();

        //CSS Styles
        $("#pagination li")
        .css({'border' : 'solid #dddddd 1px'})
        .css({'color' : '#0063DC'});

        $(this)
        .css({'color' : '#FF0084'})
        .css({'border' : 'none'});

        //Loading Data
        var pageNum = this.id;

        $("#content").load("pagination_data.php?page=" + pageNum, Hide_Load());

    });


// Editing below.        
        // Sort content Marketing    
        $("#pagination p").click(function () {

                Display_Load();

                //Loading Data
        var pageNum = this.id;    

                $("#content").load("filter_marketing.php?page=" + pageNum, Hide_Load());

        });

});

filter_marketing.php:

<?php
include('config.php');
$per_page = 3;
if($_GET)
{
$page=$_GET['page'];
}

$start = ($page-1)*$per_page;
$sql = "select * from explore where category='marketing' order by category limit $start,$per_page";
$result = mysql_query($sql);
?>
<table width="800px">
<?php
while($row = mysql_fetch_array($result))
{
$msg_id=$row['id'];
$message=$row['site_description'];
$site_price=$row['site_price'];

?>
<tr>
<td><?php echo $msg_id; ?></td>
<td><?php echo $message; ?></td>
<td><?php echo $site_price; ?></td>
</tr>
<?php
}
?>
</table>
<?php
//Pagination Numbers
for($mktg=1; $mktg<=$pages; $mktg++)
{
echo '<li class="mktg" id="'.$mktg.'">'.$mktg.'</li>';
}

1 个答案:

答案 0 :(得分:1)

  

我得到的问题是什么时候   点击段落标签即可   到'filter_marketing.php?page ='但是   将无法工作(即什么都不显示)   因为'var pageNum'不是   定义

尝试example page时,我只能获得正确的页码,如Firebug的Net面板所示。我看到的奇怪的事情是没有显示结果10-12,即第1页有结果1-9而第2页显示结果13-23(你应该真的每页10或20个结果)。

  

我只是不确定如何制作按钮   “营销”并点击它就可以了   php页面并获得结果   mysql db并显示它   分页。

your source code中的'营销'在哪里?你能提供一个例子吗?我只是不明白这个问题。

编辑:我仍然不明白这一点。尚未为#marketing分配onclick-event。此外,我会使用像&lt; input type =“submit”&gt;这样的形式的按钮。并在JavaScript中附加onclick-event。该函数可以通过AJAX调用您的PHP或转到其他URL,成功时返回false以阻止默认操作(或者只是让按钮以常规方式提交您的表单)。