Pear::Pager和AJAX的整合应用

作为一个PHP开发人员来说,大概很让人受用的一个东东就是Pear的类库了。我们知道,Pear::Pager是专门处理分页的,而Pear::HTML_AJAX则是Ajax应用的一些类库。但是Pager也不仅仅是只能用于html的分页链接,它已经为比超女还红的Ajax做好了准备,下面看看这两个包如何整合应用。

Pager and Javascript

现在走出第一步,Pager已经能够构建出javascript的链接了,和Ajax整合,理论上应该也是能够实现的,下面是Pager和javascript分页的一个例子:

require_once 'Pager/Pager.php';
$data = range(1, 100); //an array of data to paginate
$pager_params = array(
    'mode'     => 'Sliding',
    'append'   => false,  //don't append the GET parameters to the url
    'path'     => '',
    'fileName' => 'javascript:revealDiv(%d)',  //Pager replaces "%d" with the page number...
    'perPage'  => 10, //show 10 items per page
    'delta'    => 5,
    'itemData' => $data,
);
$pager = & Pager::factory($pager_params);
$n_pages = $pager->numPages();
$links = $pager->getLinks();
?>
<html>
<head>
    <script type="text/javascript" language="javascript">
    var n_pages = <?php echo $n_pages ?>;
    function revealDiv(n)
    {
        for (var count = 1; count <= n_pages; count++) {
          document.getElementById("page"+count).style.display = 'none';
        }
        document.getElementById("page"+n).style.display = 'block';
    }
    </script>
    <style type="text/css">
    div.page {
      background: #FFFF99;
      border-top: 1px solid #FFBF99;
      border-bottom: 1px solid #FFBF99;
    }
    </style>
</head>
<body>
<h1>PEAR::Pager example with JavaScript</h1>
<?php echo $links['pages']; ?>
<hr />
<?php
for ($i=1; $i <= $n_pages; ++$i) {
    echo '<div class="page" id="page'.$i.'">';
    echo '<h2>Page '.$i.'</h2>';
    foreach ($pager->getPageData($i) as $item) {
        echo 'Item '.$item.'<br />';
    }
    echo '</div>';
}
?>
<hr />
<script type="text/javascript" language="javascript">
revealDiv(1);
</script>
</body>
</html>

例子中把分页的所有数据放入一个div标签,定义了两个比较重要的参数就是path(为空)和fileName,fileName原本应该是链接的文件名,但是这里用javascript替换了。

Ajax上阵

这个例子包括三个文件page.html,server.php,testdata.php

  • page.html
  • 用动态javascript–server.php来处理数据,调用HTML_AJAX.replace(‘target’, ‘testdata.php’)来替换id为target这个div的内容。

    <html>
    <body>
    <h1>PEAR::Pager example with AJAX</h1>
    
    <script type="text/javascript" src="server.php?client=all"></script>
    
    <div id="target">I'm the target</div>
    
    <script type="text/javascript">
        HTML_AJAX.replace('target', 'testdata.php');
    </script>
    
    </body>
    </html>
  • testdata.php
  • 这是个很简单的php程序,取到分页数据并输出html

    <?php
    require_once 'Pager/Pager.php';
    $data = range(1, 100); //an array of data to paginate
    $pager_params = array(
        'mode'     => 'Sliding',
        'append'   => false,  //don't append the GET parameters to the url
        'path'     => '',
        'fileName' => 'javascript:HTML_AJAX.replace('target','testdata.php?pageID=%d');',  //Pager replaces "%d" with the page number...
        'perPage'  => 10, //show 10 items per page
        'delta'    => 1,
        'itemData' => $data,
    );
    $pager = & Pager::factory($pager_params);
    $n_pages = $pager->numPages();
    $links = $pager->getLinks();
    echo '<p>This container is loaded with an AJAX call</p>';
    echo '<p><span class="datetime">DateTime: '. date('Y-m-d H:i:s') .'</span></p>';
    echo '<h3>Page '. $pager->getCurrentPageId() .'</h3>';
    foreach ($pager->getPageData() as $item) {
        echo 'Item '. $item .'<br />';
    }
    echo '<hr />'.$pager->links;
    ?>
  • 最后,贴上幕后工作者server.php的代码
  • 用HTML_AJAX_Server来处理ajax这些烦心事吧

    <?php
    include 'HTML/AJAX/Server.php';
    
    $server = new HTML_AJAX_Server();
    $server->handleRequest();
    ?>

    web 2.0, Ajax的趋势图

    时下的web 2.0和Ajax概念正是如火如荼,且不论Ajax这东东到底是不是炒作的产物,就实际应用来说,Ajax在某些场合的确是顶好用而且看上去挺酷.

    蓝的是web 2.0,红的是Ajax
    web 2.0,ajax

    参考文档

    http://www.alberton.info/pear_pager_tutorial_javascript_navigation.html

    作者: 发表于October 23, 2006 at 7:53 am

    版权信息: 可以任意转载, 转载时请务必以超链接形式标明文章原始出处作者信息及此声明

    Tags: ,,,

    1 条评论 »

    1. yangphp 于 2008-09-11 @ 23:57:42 留言

      Ajax分页用户体验好,,但如果客房端禁用js,,又要增加额外的编程量。。所以哦。。。。一般只用ajax作一些后台管理。。前台不想用,,

    RSS 为此帖反馈评论

    留条评论