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框架自带的分页类是每次翻页都要刷新一下整个页面,这种翻页的用户体验显然是不太理想的,我们希望每次翻 ...
随机推荐
- Doragon Kuesuto 1.0
#include<stdio.h> #include<stdlib.h> #include<time.h> int main() { ; ; ; int actio ...
- 用Maven创建第一个项目
1.在Eclipse左侧的空白处点击鼠标右键,选择:New>Other : 2.选择Maven项目,点击"Next"按钮: 3.保持默认,直接点击“Next”按钮: 4.选择 ...
- 线程高级应用-心得5-java5线程并发库中Lock和Condition实现线程同步通讯
1.Lock相关知识介绍 好比我同时种了几块地的麦子,然后就等待收割.收割时,则是哪块先熟了,先收割哪块. 下面举一个面试题的例子来引出Lock缓存读写锁的案例,一个load()和get()方法返回值 ...
- 读convolutional Neural Networks Applied to House Numbers Digit Classification 的收获。
本文以下内容来自读论文以后认为有价值的地方,论文来自:convolutional Neural Networks Applied to House Numbers Digit Classificati ...
- 【Todo】Nginx架构学习
要进行Web服务,绕不开的就是Nginx.这已经是大型网站的标配.对Nginx进行一定程度的深入学习. http://www.ituring.com.cn/article/4436 http://bl ...
- 【服务器环境搭建-Centos】Nginx1.9.9 安装(编译源码)
nginx官网不同版本下载地址:http://nginx.org/download/ 我使用的是nginx-1.9.8.tar.gz 安装其他支持软件 可以使用rpm –q xxx 查询库是否已经 ...
- 在Windows和Linux上安装paramiko模块
一.paramiko模块有什么用? paramiko是用python语言写的一个模块,遵循SSH2协议,支持以加密和认证的方式,进行远程服务器的连接.由于使用的是python这样的能够跨平台运行的语言 ...
- aspx后缀映射成html
1.网站的配置文件添加如下代码: <configuration> <configSections> <section name="RewriterConfig& ...
- python语法笔记(七)
python标准库 Python有一套很有用的标准库(standard library).标准库会随着Python解释器,一起安装在你的电脑中的.它是Python的一个组成部分.这些标准库是Pytho ...
- $.extend abc
console.log(jQuery.extend(this,{'a':'b'},{'c':'d'}));console.log(this.a)var tt = jQuery.extend({},{' ...