[转]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的分页查询是最简单的,借 ...

随机推荐

ActiveReports 报表应用教程 (4)---分栏报表
在 ActiveReports 中可以实现分栏报表布局样式,可以设置横向分栏.纵向分栏,同时进行分栏和分组设置,统计分栏分组的小计.合计等.在商业报表系统中常见的分栏报表有商品标签.员工工卡.条码打印 ...
js限制input输入
1.取消按钮按下时的虚线框,在input里添加属性值 hideFocus 或者 HideFocus=true <input type="submit" value=" ...
由简入繁实现Jquery树状结构
在项目中,我们经常会需要一些树状结构的样式来显示层级结构等,比如下图的样式,之前在学.net的时候可以直接拖个服务端控件过来直接使用非常方便.但是利用Jquery的一些插件,也是可以实现这些效果的,比 ...
If you insist running as root, then set the environment variable RUN_AS_USER=root...
版权声明:本文为博主原创文章,不经博主允许注明链接即可转载. If you insist running as root, then set theenvironment variable RUN_A ...
Durandal介绍
Durandal是一个JS框架用于构建客户端single page application(SPAs).它支持MVC,MVP与MVVM前端构架模式.使用RequireJS做为其基本约定层,D ...
[翻译]:SQL死锁-为什么会出现死锁
下面这篇对理解死锁非常重要,首先死锁是如何产生的我们要清楚. We already know why blocking occurs in the system and howto detect an ...
andriod GridView
<?xml version="1.0" encoding="UTF-8"?> <GridView xmlns:android="ht ...
Android WelcomeActivity 启动画更换网络图片
1.运行效果第一张是本地的启动图,第二张是网络启动图 2.用到的第三方jar包 Android-Universal-Image-Loader-master 不熟的请看 Andro ...
【转】Android中处理崩溃异常
大家都知道,现在安装Android系统的手机版本和设备千差万别,在模拟器上运行良好的程序安装到某款手机上说不定就出现崩溃的现象,开发者个人不可能购买所有设备逐个调试,所以在程序发布出去之后,如果出现了 ...
(网络层)IP 协议首部格式与其配套使用的四个协议(ARP,RARP,ICMP,IGMP)
目录 IP协议首部格式地址解析协议 ARP逆向地址解析协议 RARP网际控制报文协议 ICMP网际组管理协议IGMP IP 数据报首部 IP数据报首部格式: 最高位在左边,记为0 bit:最低位在右边 ...

[转]Oracle分页之三：利用PagerView来实现无刷新GridView

[转]Oracle分页之三：利用PagerView来实现无刷新GridView的更多相关文章

随机推荐

热门专题