asp.net使用AJAX实现无刷新分页

(编辑:jimmy 日期: 2024/10/15 浏览:2)

查询功能是开发中最重要的一个功能,大量数据的显示,我们用的最多的就是分页。

在ASP.NET 中有很多数据展现的控件,比如Repeater、GridView,用的最多的GridView,它同时也自带了分页的功能。但是我们知道用GridView来显示数据,如果没有禁用ViewState,页面的大小会是非常的大的。而且平时我们点击首页,下一页,上一页,尾页这些功能都是会引起页面回发的,也就是需要完全跟服务器进行交互,来回响应的时间,传输的数据量都是很大的。

AJAX的分页可以很好的解决这些问题。

数据显示Pasing.aspx页面JS代码:  

复制代码 代码如下:
<script type=text/javascript>
       var pageIndex = 0;
       var pageSize = 5;
window.onload = AjaxGetData(name,0,5);
function AjaxGetData(name, index, size){
        $.ajax({
            url: jQueryPaging.aspx,
            type: Get,
            data: Name= + name + &PageIndex= + index + &PageSize= + size,
            dataType: json,
            success: function (data) {
                var htmlStr = ;
                htmlStr +=
                htmlStr +=
                htmlStr +=
                htmlStr += ;
                htmlStr +=    //data.cloudfileLists.length
                for (var i = 0; i < data.cloudfileLists.length; i++)
                {
                    htmlStr += ;
                    htmlStr +=
                                      +
                    htmlStr += ;
                }
                htmlStr += ;
                htmlStr += ;
                htmlStr += ;
                htmlStr += ;
                htmlStr += ;
                htmlStr += ;
                htmlStr += <table><thead><tr><td>编号</td><td>文件名</td></tr></thead><tbody><tr><td> + data.cloudfileLists[i].FileID + </td><td> + data.cloudfileLists[i].FileName + </td></tr></tbody><tfoot><tr><td colspan="'6'">;
                htmlStr += <span>共有记录 + data.Count + ;共<span id="'count'"> + (data.Count % 5 == 0 "'text'"><input type="'button'" value="'跳转'" onclick="'GoToAppointPage(this)'"> ;
                htmlStr += </td></tr></tfoot></table>;
 
                $(#divSearchResult).html(htmlStr);//重写html
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert(XMLHttpRequest);
                alert(textStatus);
                alert(errorThrown);
            }
        });
    }
    //首页
    function GoToFirstPage() {
        pageIndex = 0;
        AjaxGetData($(#txtSearch).val(), pageIndex, pageSize);
    }
    //前一页
    function GoToPrePage() {
        pageIndex -= 1;
        pageIndex = pageIndex >= 0 "codetitle">复制代码 代码如下:
protected void Page_Load(object sender, EventArgs e)
{
    Int32 pageIndex = Int32.MinValue;
    Int32 pageSize = Int32.MinValue;
    String name = String.Empty;
    JavaScriptSerializer jss = new JavaScriptSerializer();
    if (Request[Name] != null)
    {
        name = Request[Name].ToString();
        if (Request[PageIndex] != null)
        {
            pageIndex = Int32.Parse(Request[PageIndex].ToString());
            pageSize = Request[PageSize] != null "codetitle">复制代码 代码如下:
//<span style="font-family:">CloudFile类</span>

复制代码 代码如下:
    public class CloudFile
    {
        public String FileID { get; set; }
        public String FileName { get; set; }
        public String FileDirName { get; set; }
    }

这样一个简单的无刷新分页的实例就完成了。由于本人的JS水平有限,现在只能做到这了。当然还可以添加一些新的功能。这里我只是想将我的方法与大家分享。至于功能,待以后继续完善了!!!

一句话新闻

一文看懂荣耀MagicBook Pro 16
荣耀猎人回归!七大亮点看懂不只是轻薄本,更是游戏本的MagicBook Pro 16.
人们对于笔记本电脑有一个固有印象:要么轻薄但性能一般,要么性能强劲但笨重臃肿。然而,今年荣耀新推出的MagicBook Pro 16刷新了人们的认知——发布会上,荣耀宣布猎人游戏本正式回归,称其继承了荣耀 HUNTER 基因,并自信地为其打出“轻薄本,更是游戏本”的口号。
众所周知,寻求轻薄本的用户普遍更看重便携性、外观造型、静谧性和打字办公等用机体验,而寻求游戏本的用户则普遍更看重硬件配置、性能释放等硬核指标。把两个看似难以相干的产品融合到一起,我们不禁对它产生了强烈的好奇:作为代表荣耀猎人游戏本的跨界新物种,它究竟做了哪些平衡以兼顾不同人群的各类需求呢?