静态页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
body{font-size:84%; color:#333333; line-height:1.4;}
a{color:#34538b;}
#Searchresult{width:300px; height:100px; padding:20px; background:#f0f3f9;}
</style>

<link rel="stylesheet" href="<?php echo base_url();?>static/pagination.css" />
<script type="text/javascript" src="<?php echo base_url();?>static/jquery.js"></script>
<script type="text/javascript" src="<?php echo base_url();?>static/jquery.pagination.js"></script>
<script type="text/javascript">

$(document).ready(function(){
       pageselectCallback(0);
       function pageselectCallback(page_index )
        {
            var limit = 5;
            var offset = page_index * limit;
            $.ajax({
                   url : '<?php echo site_url('test/ajax_page');?>',
                   async : false,
                   type : 'POST',
                   dataType : 'json',
                   data : "post_data=abc&limit="+ limit+"&offset="+offset,
                   beforeSend: function() {
                        $("#Searchresult").html("<p>Wait .......</p>");
                   },
                   success: function( data ){
                        var m_html = '';
                        if(data.ok == '1')
                            $(data.result).each(function(i,item){
                                m_html +=  item.catalog+' == '+item.name+" <br>";
                            })
                        $("#Searchresult").html(m_html);
                   }
             })
        }
           // 创建分页
           $("#Pagination").pagination( <?php echo $num;?>, {
                    num_edge_entries: 0,
                    num_display_entries: 6,
                    items_per_page: 5,
                    ellipse_text: " ",
                    link_to: '#&',
                    prev_text: '«PREV',
                    next_text: 'NEXT»',
                    callback: pageselectCallback
           });
    });  
       
</script>
</head>
<body>
    <div id="Pagination" class="pagination"  style="width:960px; height: 200px;"><!-- 这里显示分页 --></div>
<div id="Searchresult">分页初始化完成后这里的内容会被替换。</div>   
</body>
</html>

php:

public function ajax_page()
   {      
            $this->load->helper('url');
             $this->load->database('abgent_product');
            $arrs = $this->db->select("count(*) as num ")->get('abgent_products')->row_array();
            $data['num'] = $arrs['num'];
            if( $this->input->post('post_data') )
            {
                  $limit = $this->input->post('limit');
                  $offset = $this->input->post('offset');
                  $arr = $this->db->select("catalog,name")->limit($limit)->offset($offset)->get('abgent_products')->result_array();
                  $data['result'] = $arr ;
                  $data['ok'] = 1;
                  echo json_encode($data);
            }else{
                 $this->load->view('welcome_message',$data);
            }
            
    }

ajax分页2：jquery.pagination +JSON 动态无刷新分页的更多相关文章

  1. jquery.pagination +JSON 动态无刷新分页

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="SqlPage.aspx.cs& ...

  2. Bootstrap Paginator分页插件+ajax 实现动态无刷新分页

    之前做分页想过做淘宝的那个,但是因为是后台要求不高,就Bootstrap Paginator插件感觉还蛮容易上手,所以就选了它. Bootstrap Paginator分页插件下载地址: Downlo ...

  3. asp.net中利用Jquery+Ajax+Json实现无刷新分页(二)

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="PageTest.aspx.cs ...

  4. jquery.pagination.js数据无刷新真分页

    定义一个全局的分页加载变量,并设置为true: var __isReSearch=true; 定义分页的一些数据: var __PageSize = 10; var __SearchCondition ...

  5. 无刷新分页 jquery.pagination.js

     无刷新分页 jquery.pagination.js 采用Jquery无刷新分页插件jquery.pagination.js实现无刷新分页效果 1.插件参数列表 http://www.dtan.so ...

  6. 自己动手用Javascript写一个无刷新分页控件

    .NET技术交流群:337901356 ,欢迎您的加入! 对 于一个用户体验好的网站来说,无刷新技术是很重要的,无刷新,顾名思义,就是局部刷新数据,有用过Asp.net Web Form技术开发网页的 ...

  7. jquery ajax php+mysql 无刷新分页 详细实例

    最近在接触jquery和ajax,当前项目也会用到分页,为了用户体验更好一些,就准备用无刷新分页,这个demo很适合新手学习查看,写的比较清晰,话不多说,直接上代码吧. 首先是html页面,index ...

  8. javascript;Jquery;获取JSON对象，无刷新分页，异步加载，异步删除，实例。

    AjaxNewsList: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> < ...

  9. TP2.0或3.1 或者 3.2 下使用ajax+php做无刷新分页（转+自创）

    1.前言 作为一名php程序员,我们开发网站主要就是为了客户从客户端进行体验,在这里,thinkphp框架自带的分页类是每次翻页都要刷新一下整个页面,这种翻页的用户体验显然是不太理想的,我们希望每次翻 ...

随机推荐

  1. Scrum Meeting---Ten(2015-11-5)

    今日已完成任务和明日要做的任务 姓名 今日已完成任务 今日时间 明日计划完成任务 估计用时 董元财 分类页设计 4h 商品详单设计 4h 胡亚坤 首页设计 2h 滚动广告栏设计 2h 刘猛 服务器测试 ...

  2. FFPEG 转码记录------解决了有流，但是没有码率和FPS？

    命令行:(已经测试成功) ffmpeg -i rtmp://localhost/live/S0000_8 -c:v libx264 -b:v 500k -c:a libfdk_aac -b:a 64k ...

  3. JavaWeb项目的classpath说明

    概念解释: classpath : 即项目中WEB-INF下面的classes目录; 应用: [01] src路径下的文件在编译后会放到WEB-INF/classes路径下.默认的classpath是 ...

  4. Win7_SendTo文件夹

    Win7系统浮动sendto目录现在被移到了这里 : %APPDATA%\Microsoft\Windows\SendTo %APPDATA%是个环境变量,具体来说是在这里: C:\users\??? ...

  5. Android 自定义对话框

    Android实现自定义对话框效果: 核心代码: package com.example.diydialog; import android.os.Bundle; import android.app ...

  6. number-of-segments-in-a-string

    https://leetcode.com/problems/number-of-segments-in-a-string/ package com.company; class Solution { ...

  7. Java中的Double类型计算

    一.问题的提出: 如果我们编译运行下面这个程序会看到什么?public class Test{    public static void main(String args[]){        Sy ...

  8. C#_微信支付V3

    基础问题先排除: 确保 商户功能 审核通过,会有官方邮件 支付授权目录(注意看文档,大小写关系很大 点击支付按钮,提示“access_denied” 网上有很多关于此问题的解决) 点击支付按钮,提示“ ...

  9. mac app icon 设置

    mac app icon 设置 1:目前 mac app 所需要的icon 图标尺寸 icon_16x16.png 16px icon_16x16@2x.png 32px icon_32x32.png ...

  10. 在线读取Mongodb数据库下载EXCEL文件

    版本:Mongodb2.4.8 通过页面下载Excel文件 jsp <%@ page language="java" contentType="text/html; ...