[转]Oracle分页之三:利用PagerView来实现无刷新GridView
本文转自:http://www.cnblogs.com/scy251147/archive/2011/04/16/2018355.html
接上面一节,上面还存在问题就是分页控件使用的仍然是服务器端控件,没点一次就要刷新页面一次,也就是向服务器端请求一次。那么用什么方法能够让页面无刷新而进行分页呢?
在这里,我想到了PagerView这套开源控件,有兴趣的朋友可以通过PagerView关键字去搜搜,然后研究下,这个封装的还是挺好的。
但是,这里遇到一个问题,如何让页面的GridView实现无刷新加载数据呢?这里我不得不提到我以前文章中写道的ICallbackEventhandler接口,这是微软的一个ajax回调接口,然后再配合这输出页面HTML的方式,不就可以实现无刷新GridView分页了吗?
前台代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="PagerWithPagerView.aspx.cs" Inherits="PagerWithPagerView" %> <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="tableview/scripts/jquery.js" type="text/javascript"></script>
<script src="tableview/scripts/PagerView.js" type="text/javascript"></script>
<link href="tableview/style.css" rel="stylesheet" type="text/css" />
<link href="css/TableZB.css" rel="stylesheet" type="text/css" />
<link href="css/swcss.css" rel="stylesheet" type="text/css" />
<link href="css/GridViewCSS_O.css" rel="stylesheet" type="text/css" />
<%--<style type="text/css"> .PagerView a
{
background:url(images/loginButton.gif) no-repeat; } </style>--%> </head>
<body>
<form id="form1" runat="server">
<div id="myData">
<asp:GridView CssClass="GVtable" ID="GridView1" runat="server" Width="100%"
AutoGenerateColumns="False">
<Columns>
<asp:TemplateField HeaderText="编号">
<ItemTemplate>
<%#Eval("R").ToString() %></ItemTemplate></asp:TemplateField>
<asp:TemplateField HeaderText="纳税人识别码">
<ItemTemplate><%#Eval("nsrsbm").ToString() %></ItemTemplate></asp:TemplateField>
<asp:TemplateField HeaderText="纳税人名称">
<ItemTemplate><%#Eval("nsr_mc") %></ItemTemplate></asp:TemplateField>
<asp:TemplateField HeaderText="登记类型">
<ItemTemplate><%#Eval("djlx_mc")%></ItemTemplate></asp:TemplateField>
<asp:TemplateField HeaderText="登记状态">
<ItemTemplate><%#Eval("dj_ztmc")%></ItemTemplate></asp:TemplateField>
<asp:TemplateField HeaderText="注册类型">
<ItemTemplate><%#Eval("zclx_mc")%></ItemTemplate></asp:TemplateField>
<asp:TemplateField HeaderText="所别">
<ItemTemplate><%#Eval("gljg_mc")%></ItemTemplate></asp:TemplateField>
<asp:TemplateField HeaderText="专管员">
<ItemTemplate><%#Eval("zgy_mc")%></ItemTemplate></asp:TemplateField>
<asp:TemplateField HeaderText="所属性">
<ItemTemplate><%#Eval("ssx_mc")%></ItemTemplate></asp:TemplateField>
<asp:TemplateField HeaderText="操作">
<ItemTemplate>
<asp:LinkButton ID="lbtnOperation" CommandArgument='<%#Eval("nsrsbm") %>' runat="server">编辑</asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<script type="text/javascript">
window.onload=function(){
var pager = new PagerView('pager'); //pager对象申明
pager.itemCount = <%=totalCount %>; //设置当前显示的页索引
pager.size = <%=_pageSize %>; //设置每页显示条数
pager.onclick = function(index) {
raiseCallBack(index,""); //当分页按钮被点击的时候,触发的Ajax回调函数
};
pager.render();
} //ajax回调成功后,进行处理的函数
function rServer(arg,context)
{
$("#myData").text();
$("#myData").html(arg);
} //ajax回调函数,用户向后台请求数据
function raiseCallBack(arg,context)
{
<%=ClientScript.GetCallbackEventReference(this,"arg","rServer","context") %>;
}
</script>
</form>
<div id="pager"></div>
</body>
</html>
那么在后台只要先实现ICallbackEventhandler接口,然后获取从前台传送过来的数据,进行处理,最后将html标签元素打到前台即可。
后台代码如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data; public partial class PagerWithPagerView : System.Web.UI.Page,ICallbackEventHandler
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
Bind();
}
} public static int _pageSize = ;
public static int _startSize = ;
public static int totalCount; public string _str; //绑定gridview 并将绑定后的gridview对象返回
private GridView Bind()
{
string sqlQuery = "select nsrsbm,nsr_mc,djlx_mc,dj_ztmc,zclx_mc,gljg_mc,zgy_mc,ssx_mc from scott.t_yhs_djxxtz";
DataSet ds = Pagination.PaginationPager(sqlQuery, _pageSize, _startSize, out totalCount);
GridView1.DataSource = ds.Tables["Table"];
GridView1.DataBind();
return GridView1;
} public string GetCallbackResult()
{
return _str; //将html返回到前台
} public void RaiseCallbackEvent(string eventArgument)
{
if (!string.IsNullOrEmpty(eventArgument))
{
_startSize = Int32.Parse(eventArgument);
Response.ClearContent(); //清除
GridView gv=Bind(); //得到GridView对象
System.Text.StringBuilder sb = new System.Text.StringBuilder();
System.IO.StringWriter sw = new System.IO.StringWriter(sb);
HtmlTextWriter htw = new HtmlTextWriter(sw);
Header.RenderControl(htw);
gv.RenderControl(htw); //将生成的html元素render出来
_str = sb.ToString();
}
} }
代码中已经有了注释,我这里不再详细说明,这里只要知道ICallbackEventhandler接口的使用方法即可。
[转]Oracle分页之三:利用PagerView来实现无刷新GridView的更多相关文章
- nodejs利用ajax实现网页无刷新上传图片
nodejs利用ajax实现网页无刷新上传图片 标签(空格分隔): nodejs 通常情况下上传图片是要通过提交form表单来实现的,但是这又不可避免的产生了网页转. 利用ajax技术和FormDat ...
- 扩展GridView实现的一个自定义无刷新分页,排序,支持多种数据源的控件TwfGridView
最近项目View层越来越趋向于无刷新化,特别是数据展示方面,还要对Linq有很好的支持.在WebFrom模式的开发中,GridView是一个功能很强大,很常用的控件,但是他也不是完美的,没有自带的无刷 ...
- 无刷新分页 jquery.pagination.js
无刷新分页 jquery.pagination.js 采用Jquery无刷新分页插件jquery.pagination.js实现无刷新分页效果 1.插件参数列表 http://www.dtan.so ...
- 自己动手用Javascript写一个无刷新分页控件
.NET技术交流群:337901356 ,欢迎您的加入! 对 于一个用户体验好的网站来说,无刷新技术是很重要的,无刷新,顾名思义,就是局部刷新数据,有用过Asp.net Web Form技术开发网页的 ...
- 利用Content-disposition实现无刷新下载图片文件
今天在使用 tinypng.com 这个在线压缩图片的网站时,对其处理完图片后,可以无刷新下载图片感到好奇,于是了解了一下相关实现.无刷新下载可以利用MIME type或者设置Content-disp ...
- Oracle 分页原理
oracle rownum 及分页处理的使用方法 在实际应用中我们经常碰到这样的问题,比如一张表比较大,我们只要其中的查看其中的前几条数据,或者对分页处理数据.在这些情况下我们都需要用到rownum. ...
- 【SQL】Oracle分页查询的三种方法
[SQL]Oracle分页查询的三种方法 采用伪列 rownum 查询前10条记录 ? 1 2 3 4 5 6 7 8 9 10 11 [sql] select * from t_user t whe ...
- Sqlserver2008和Oracle分页语句
SqlServer 分页语句 select StuID ,StuNo,StuName,Age,Sex, ClassName ClassName from (select *, row_number() ...
- mysql和oracle 分页查询(转)
最近简单的对oracle,mysql,sqlserver2005的数据分页查询作了研究,把各自的查询的语句贴出来供大家学习..... (一). mysql的分页查询 mysql的分页查询是最简单的,借 ...
随机推荐
- C#为工作Sql而产生的字符串分割小工具(很实用,你值得拥有)
写在前面 为什么要写这个工具? 工作需要,拼接字符串头晕眼花拼接的,特别是in 查询,后面的参数太多,想在数据执行一些这个sql语句老费劲了. 看正文 工作所有的(后台)攻城狮们都会接触到sql语句, ...
- 雷军V5,米3横空出世
小米3 下午两点,小米CEO:雷军(也是一个传奇人物),虽然没购买门票,只是自己一个人看微博,看新闻,还是了解到了小米3的面貌,这次雷哥还给大家带来了MITV,售价¥2999!(无法相信)顶配.这次我 ...
- 用C语言制作爱心
国庆我们实验室布置了作业,其中一项为,利用流程控制语句打印以下图形 * *** ***** ******* ***** *** * 代码如下 #include <stdio.h> int ...
- (旧)子数涵数·PS——换脸
一.打开Photoshop,打开下载好的两张素材图(均在百度下载的). 二.选中人物脸的部分,不需要很精确(哪种抠图方式都行,我用的是矩形选框工具),再使用移动工具(快捷键为V,或者按着Ctrl),将 ...
- 基于java的socket编程
#开头的废话#学习java已经半个月了,原本在抠教材里面的字眼时,觉得教材好厚,要看完不知道要到猴年马月去了.突然在网上看到一个教程,里面老师说学编程语言书不用太细看,看个大概,知道里面讲些什么就好, ...
- 【GOF23设计模式】享元模式
来源:http://www.bjsxt.com/ 一.[GOF23设计模式]_享元模式.享元池.内部状态.外部状态.线程池.连接池 package com.test.flyweight; /** * ...
- [WP8] ListBox的Item宽度自动填满
[WP8] ListBox的Item宽度自动填满 范例下载 范例程序代码:点此下载 问题情景 开发WP8应用程序的时候,常常会需要使用ListBox作为容器来呈现各种数据集合.但是在ListBox呈现 ...
- lambda 个人学习理解
lambda是简化代码量的写用更简单的方法来写匿名方法 lambda左边是参数,右边是代码块(方法执行语句). 整体运算结果是根据左边参数,执行右边语句,返回右边执行的结果: 匿名方法是简化方法 1. ...
- gulp学习笔记--简单入门
一.准备工作 1.gulp是基于nodeJS的前端构建工具,所以全局安装nodeJS 2.利用npm全局安装gulp. npm install -g gulp 3.在项目根目录下新建文件package ...
- inherit与auto
大家是不是和我一样,在刚开始学习css的时候,在css文件开头是不是经常看到这样的代码: * {margin:0 px; padding:0 px;} . 在接下来设置颜色字体时在body元素的cs ...