前台代码

<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <meta charset="utf-8" />

    <link href="css/table.css" rel="stylesheet" />

    <script src="js/jquery-3.2.1.js"></script>

    <script>

        $(function () {

            //网页启动加载数据

            Init();

        });

        function Init(postData) {

            //网页启动时,获取指定的数据

            $.getJSON("ProcessInfo.ashx", postData, function (data) {

                //先将原有内容清空

                $("table tbody").empty();

                //拿到当前列表

                var list = data.list;

                //循环读取列表中的数据

                for (var i = 0; i < list.length; i++) {

                    str = "<tr>";

                    //将数据填充

                    str += "<td>" + list[i].CustomerID + "</td>";

                    str += "<td>" + list[i].CustomerCompany + "</td>";

                    str += "<td>" + list[i].CustomerName + "</td>";

                    str += "<td>" + list[i].CustomerContact + "</td>";

                    str += "<td>" + list[i].CustomerAddress + "</td>";

                    str += "<td>" + list[i].CustomerCity + "</td>";

                    str += "<td>" + list[i].CustomerArea + "</td>";

                    str += "<td>" + list[i].CustomerCode + "</td>";

                    str += "<td>" + list[i].CustomerCountry + "</td>";

                    str += "<td>" + list[i].CustomerTelephone + "</td>";

                    str += "<td>" + list[i].CustomerFax + "</td>";

                    str += "</tr>";

                    //将数据追加到表格中

                    $("table tbody").append(str);

                }

                //将分页标签放到div里去

                $("#nav").append(data.nav);

                //给分页标签绑定点击事件

                $("#nav a").click(function () {

                    //清空原有分页标签

                    $("#nav").empty();

                    //获取分布标签a链接的href属性值

                    var href = $(this).attr("href");

                    //获取分布标签a链接?后面的数据,得到pageIndex和pageSize的键值对集合

                    var queryString = href.substr(href.lastIndexOf("?") + 1);

                    //将数据传递到方法中继续加载

                    Init(queryString);

                    return false;

                })

            });

        }

    </script>

    <style>

        #nav{

            margin-top:20px;

        }

        #nav a,#nav span{

            border:1px solid #ccc;

            padding:10px;

        }

    </style>

</head>

<body>

    <div class="content">

        <!-- 数据显示区域  开始-->

        <table>

            <thead>

                <tr>

                    <th>客户ID</th>

                    <th>公司名称</th>

                    <th>联系人姓名</th>

                    <th>联系人职务</th>

                    <th>地址</th>

                    <th>城市</th>

                    <th>地区</th>

                    <th>邮政编码</th>

                    <th>国家</th>

                    <th>电话</th>

                    <th>传真</th>

                </tr>

            </thead>

            <tbody>

            </tbody>

        </table>

        <!-- 数据显示区域  结束-->

        <!-- 分页标签显示  开始-->

        <div id="nav"></div>

        <!-- 分页标签显示  结束-->

    </div>

</body>

</html>

后台代码,请求ashx一般处理程序

 public void ProcessRequest(HttpContext context)

        {

            context.Response.ContentType = "text/plain";

            //获取前台传递的当前页码

            int pageIndex = Convert.ToInt32(context.Request["pageIndex"]??"");

            //获取前台传递的数量

            int pageSize = Convert.ToInt32(context.Request["pageSize"] ?? "");

            //实例化bll层业务对象

            BLL.CustormerBll bll = new BLL.CustormerBll();

            //得到当前应该显示的数据量

            List<Model.CustomerMl> list = bll.GetPage(pageSize, pageIndex);

            //得到当前整个表的条数

            int count = bll.GetCount();

            //调用方法获取分页标签

           string nav= Common.PageForRao.Page(pageIndex, count, pageSize, "");

            //将数据和分页标签放在匿名类中

            var objSon = new { list = list, nav = nav };

            //实例化一个序列化对象

            System.Web.Script.Serialization.JavaScriptSerializer ser = new System.Web.Script.Serialization.JavaScriptSerializer();

            //将装载了前台所需要的数据进行序列化

            string data = ser.Serialize(objSon);

            //将序列化后的数据传递给前台

            context.Response.Write(data);

        }

运行后效果

点击下一页时,以及1,2,3,4,5时的效果如下图

当点击到第6页,以及7,8,9时的效果图

当点 击到第10页(最末页时)

对自写的Asp.Net分页控件的应用方式(异步无刷新分页)的更多相关文章

  1. ASP.NET MVC 使用Uploadify实现多文件异步无刷新上传

    软件技术开发,合作请联系QQ:858-048-581 这里我通过使用uploadify组件来实现异步无刷新多文件上传功能. 1.首先下载组件包uploadify,我这里使用的版本是3.1 2.下载后解 ...

  2. knockout Ajax异步无刷新分页 Demo +mvc+bootstrap

    最近工作中web客户端需要用到knockout,在此记录下一些Demo,以后用到的时候查找起来方便.也希望给新入门的knockout使用者一点经验.knockout官方文档.这儿是一个使用knocko ...

  3. ajax分页2：jquery.pagination +JSON 动态无刷新分页

    静态页面: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  4. SUI分页组件和avalon搞定ajax无刷新分页

    <div ms-controller="main"> <h2 class="pagination-centered">{{ title ...

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

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

  6. 基于存储过程的MVC开源分页控件--LYB.NET.SPPager

    摘要 现在基于ASP.NET MVC的分页控件我想大家都不陌生了,百度一下一大箩筐.其中有不少精品,陕北吴旗娃杨涛大哥做的分页控件MVCPager(http://www.webdiyer.com/)算 ...

  7. 基于存储过程的MVC开源分页控件

    基于存储过程的MVC开源分页控件--LYB.NET.SPPager 摘要 现在基于ASP.NET MVC的分页控件我想大家都不陌生了,百度一下一大箩筐.其中有不少精品,陕北吴旗娃杨涛大哥做的分页控件M ...

  8. 在DevExpress程序中使用Winform分页控件直接录入数据并保存

    一般情况下,我们都倾向于使用一个组织比较好的独立界面来录入或者展示相关的数据,这样处理比较规范,也方便显示比较复杂的数据.不过在一些情况下,我们也可能需要直接在GridView表格上直接录入或者修改数 ...

  9. WPF 实现 DataGrid/ListView 分页控件

    在WPF中,通常会选用DataGrid/ListView进行数据展示,如果数据量不多,可以直接一个页面显示出来.如果数据量很大,2000条数据,一次性显示在一个页面中,不仅消耗资源,而且用户体验也很糟 ...

随机推荐

  1. 构造函数(JAVA)

    构造函数 :是一种特殊的方法,主要用来在创建对象时初始化对象, 即为对象成员变量赋初始值,总与new运算符一起使用在创建对象的语句中. 特别的一个类可以有多个构造函数 ,可根据其参数个数的不同或参数类 ...

  2. LOJ#2015. 「SCOI2016」妖怪（凸包）

    传送门 首先可以把每个妖怪看成二维平面上的一个点,那么每一个环境\((a,b)\)就可以看成一条斜率\(k=-\frac{b}{a}\)的过该点的直线,战斗力就是这条直线在两坐标轴上的截距之和 对于每 ...

  3. html实现时间输入框

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. Usboot V1.68版本

    V1.68版本,我的收藏之一 官方的介绍: 市面上现在大多数U盘都支持启动机器的功能,但是要制作启动型U盘,需要进入WIN98,现在很多人机器 上都没有98了吧,呵呵.为了做个启动盘,装一个98,多冤 ...

  5. FTP枢轴攻击

    简单来说,这是攻击者可以利用属于不同网络的那些系统的攻击. 本文作者:jishuzhain 对于这种攻击,攻击者需要利用主服务器来帮助攻击者将自己添加到本地网络中,然后攻击者就可以将客户端系统进行定位 ...

  6. HTTP 缓存机制详解

    从这里看的 http://mp.weixin.qq.com/s/8UXEMQBkV9hHwtu9R7mV5w

  7. php防止网站被刷新

    在实际应用中,总会遇到某些页面被恶意用户刷新.当你的系统在某些模块没有使用缓存的时候,频繁的刷新会导致数据库吃紧.下面附上一段代码,防止频繁的刷新造成的死机情况. 主要是从 session方面进行限制 ...

  8. [AIR] AS3操作文件时报SecurityError: fileWriteResource 错的解决方法

    在用File操作(移动,删除等)或者写入文件时,以下写法会报错 var file:File =File.applicationDirectory.resolvePath("1.swf&quo ...

  9. 队列的理解和实现(一) ----- 循环队列(java实现)

    什么是队列 我们都知道栈是先进后出的一种线性表,与之相反的是,队列是一种先进先出的线性表.它只允许在表的一端进行插入,而在另一端进行删除.举个例子来说,在生活中我们买东西需要进行排队,最先排队的可以最 ...

  10. iOS开发～制作同时支持armv7,armv7s,arm64,i386,x86_64的静态库.a以及 FrameWork 的创建

    armv7,armv7s,arm64,i386,x86_64 详解 一.概要 平时项目开发中,可能使用第三方提供的静态库.a,如果.a提供方技术不成熟,使用的时候就会出现问题,例如: 在真机上编译报错 ...