ajax分页2:jquery.pagination +JSON 动态无刷新分页
静态页面:
<!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 动态无刷新分页的更多相关文章
- jquery.pagination +JSON 动态无刷新分页
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="SqlPage.aspx.cs& ...
- Bootstrap Paginator分页插件+ajax 实现动态无刷新分页
之前做分页想过做淘宝的那个,但是因为是后台要求不高,就Bootstrap Paginator插件感觉还蛮容易上手,所以就选了它. Bootstrap Paginator分页插件下载地址: Downlo ...
- asp.net中利用Jquery+Ajax+Json实现无刷新分页(二)
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="PageTest.aspx.cs ...
- jquery.pagination.js数据无刷新真分页
定义一个全局的分页加载变量,并设置为true: var __isReSearch=true; 定义分页的一些数据: var __PageSize = 10; var __SearchCondition ...
- 无刷新分页 jquery.pagination.js
无刷新分页 jquery.pagination.js 采用Jquery无刷新分页插件jquery.pagination.js实现无刷新分页效果 1.插件参数列表 http://www.dtan.so ...
- 自己动手用Javascript写一个无刷新分页控件
.NET技术交流群:337901356 ,欢迎您的加入! 对 于一个用户体验好的网站来说,无刷新技术是很重要的,无刷新,顾名思义,就是局部刷新数据,有用过Asp.net Web Form技术开发网页的 ...
- jquery ajax php+mysql 无刷新分页 详细实例
最近在接触jquery和ajax,当前项目也会用到分页,为了用户体验更好一些,就准备用无刷新分页,这个demo很适合新手学习查看,写的比较清晰,话不多说,直接上代码吧. 首先是html页面,index ...
- javascript;Jquery;获取JSON对象,无刷新分页,异步加载,异步删除,实例。
AjaxNewsList: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> < ...
- TP2.0或3.1 或者 3.2 下使用ajax+php做无刷新分页(转+自创)
1.前言 作为一名php程序员,我们开发网站主要就是为了客户从客户端进行体验,在这里,thinkphp框架自带的分页类是每次翻页都要刷新一下整个页面,这种翻页的用户体验显然是不太理想的,我们希望每次翻 ...
随机推荐
- 《易货》Alpha版本发布说明
一.引言 本说明描述了校淘1.0版本的已经实现的主要功能,对运行环境的要求,以及目前软件所具有的一些问题和限制. 二.主要功能 本软件面向的是在校大学生,方便大学生将自己闲置的物品以二手商品的形式发布 ...
- E2 2014.5.8 更新日志
增加功能 增加报价单功能,可以针对指定客户生成报价单,可以直接生成一个在线地址,直接把地址发给客户在线打开 传统的报价,先生成一个EXCEL,再传给客户,使用E2,这一切都变得简单,你可生成一个在线地 ...
- 操作系统基础知识之————单线程(Thread)与多线程的区别
单线程(Thread)与多线程的区别 (一)首先了解一下cpu: 随着主频(cpu内核工作时钟频率,表示在CPU内数字脉冲信号震荡的速度,等于外频(系统基本时间)乘倍频)的不断攀升,X86构架的硬件逐 ...
- hanio 塔和递规的理解。
//递规很好理解,但是初看hanoi的时候,总没有理所当然的感觉.//那应该是对递规根本还没理解吧.仔细想了下.有点总结. 后来翻到 <<数据结构>> 112页,原来hanio ...
- MonkeyRunner学习(1)测试连接
前期的环境搭建详见:http://www.cnblogs.com/peng-lan/p/5388488.html 1.打开模拟器 打开模拟器有两种方法,正常的在eclipse 中启动就不介绍了 另一种 ...
- Android_进化史和平台架构介绍
一.Android平台发展史 2008年9月,谷歌正式发布了Android 1.0系统,全球第一台Android设备HTC (G1) 2009年4月,谷歌正式推出了Android 1.5 ...
- Python核心编程-基础2
open() 和 file() 函数会同时存在, 完成相同的功能.一般说来, 我们建议使用 open() 来读写文件, 在您想说明您在处理文件对象时使用 file() , 例如 if instance ...
- 在XP下把win7安装到VHD,内存足够大可以RAMOS
在XP下把win7安装到VHD,内存足够大可以RAMOS1.用DiskGenius创建VHD固定大小磁盘文件,以win7vhd.vhd为例,然后进行分区格式化,格式化时启用NTFS压缩.2.进入WIN ...
- iOS设置app应用程序文件共享
1.iOSapp应用程序文件共享 当我们用itnues连接到设备时,在应用程序栏目下面,文件共享下,点击 对应的程序,即可以在程序右边栏目里面看到应用程序共享的数据, 此时,我们可以通过右下角的 添加 ...
- C/C++大数库简介
在网络安全技术领域中各种加密解密算法的软件实现上始终有一个共同的问题就是如何在普通的PC机上实现大数的运算.我们日常生活中所应用的PC机内部字长多是32位或64位,但是在各种加密解密的算法中为了达到一 ...