jQuery Pagination Plugin ajax分页控件

时间：2023-03-09 07:54:01
jQuery Pagination Plugin ajax分页控件 
<html>

    <body>

        <div id="datagrid">

        </div>

        <div id="pagination">

        </div>

    </body>

    <script src="http://image.**.com/common/js/jquery-1.8.3.min.js" type="text/javascript"></script>

    <script src="js/jquery.pagination.js"></script>

    <script type="text/javascript">

        var pagination = {

            $divPagination: $('#pagination'), //分页控件容器

            $divDatagrid: $('#datagrid'), //数据容器

            urlRecordCount: "index.php?c=homepage&m=prizeRecordCount", //接口返回数据的总行数

            urlRecordLists: "index.php?c=homepage&m=prizeLogLists&pageIndex=", //接口返回JSON格式的数据

            callback: function(pageIndex, $divPagination) {

                $.getJSON(pagination.urlRecordLists + pageIndex, function(jsonRecordLists) {

                    if (jsonRecordLists == undefined || jsonRecordLists.length == 0) {

                        pagination.$divDatagrid.html('没有数据');

                        return false;

                    }

                    html = '';

                    $.each(jsonRecordLists, function(index, item) {

                        html += '奖品:' + item['prize_name'] + '    时间:' + item['create_time'] + '<br/>';

                    });

                    pagination.$divDatagrid.html(html);

                });

                return false;

            },

            initPagination: function() {

                $.getJSON(pagination.urlRecordCount, function(recordCount) {

                    pagination.$divPagination.pagination(recordCount, {

                        callback: pagination.callback,

                        items_per_page: 10, //pageSize

                        next_text: '下一页',

                        next_show_always: false, //当下一页无法使用时是否显示,true(默认)

                        prev_text: '上一页',

                        prev_show_always: false,

                        link_to: 'javascript:void(0);', //分页href中的内容,#(默认)

                        num_display_entries: 11, //最多显示多少分页链接:11(默认),0(只显示上一下和下一页)

                        num_edge_entries: 1, //1(任何情况下都显示第一页和最后一页),0(不显示)

                        ellipse_text: '...', //当num_edge_entries>0时,分页使用的省略符号

                        current_page: 0, //默认pageIndex,0(默认),false(不加载)

                        load_first_page: true, //第一次自动加载,true(默认),false(不加载)

                    });

                });

            }

        };

        $(document).ready(function() {

            pagination.initPagination();//分页控件初始化

        });

    </script>

</html>

//php后台返回JSON数据

        $pageIndex = intval($this->input->get('pageIndex'));

        $test = $this->homepage_model->getPrizeLogLists($pageIndex, 10);

        $test = eval('return ' . iconv('gbk', 'UTF-8', var_export($test, true) . ';'));

        exit(json_encode($test));
JQuery_pagination:https://github.com/gbirke/jquery_pagination

相关文章