asp.net中利用Jquery+Ajax+Json实现无刷新分页的实例代码
来源: 阅读:2007 次 日期:2014-10-11 14:28:15
温馨提示: 小编为您整理了“asp.net中利用Jquery+Ajax+Json实现无刷新分页的实例代码”,方便广大网友查阅!

本篇文章主要是对asp.net中利用Jquery+Ajax+Json实现无刷新分页的实例代码进行了介绍,需要的朋友可以过来参考下,需要对大家有所帮助

代码如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxJson.aspx.cs" Inherits="AjaxJson" %>

<!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 runat="server">

<title>Jquery+Ajax+Json分页</title>

<meta http-equiv="content-type" content="text/html; charset=gb2312">

<link href="Styles/tablecloth.css" rel="stylesheet" type="text/css" />

<link href="Styles/pagination.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="Scripts/jquery-1.4.4.min.js"></script>

<script type="text/javascript" src="Scripts/jquery.pagination.js"></script>

<script type="text/javascript">

var pageIndex = 0; //页面索引初始值

var pageSize = 10; //每页显示条数初始化,修改显示条数,修改这里即可

$(function () {

InitTable(0); //Load事件,初始化表格数据,页面索引为0(第一页)

//分页,PageCount是总条目数,这是必选参数,其它参数都是可选

$("#Pagination").pagination(<%=pageCount %>, {

callback: PageCallback,

prev_text: '上一页', //上一页按钮里text

next_text: '下一页', //下一页按钮里text

items_per_page: pageSize, //显示条数

num_display_entries: 6, //连续分页主体部分分页条目数

current_page: pageIndex, //当前页索引

num_edge_entries: 2 //两侧首尾分页条目数

});

//翻页调用

function PageCallback(index, jq) {

InitTable(index);

}

//请求数据

function InitTable(pageIndex) {

$.ajax({

type: "POST",

dataType: "json",

url: 'SupplyAJAX.aspx', //提交到一般处理程序请求数据

data: "type=show&random=" + Math.random() + "&pageIndex=" + (pageIndex + 1) + "&pageSize=" + pageSize, //提交两个参数:pageIndex(页面索引),pageSize(显示条数)

error: function () { alert('error data'); }, //错误执行方法

success: function (data) {

$("#Result tr:gt(0)").remove(); //移除Id为Result的表格里的行,从第二行开始(这里根据页面布局不同页变)

var json = data; //数组

var html = "";

$.each(json.data, function (index, item) {

//循环获取数据

var id = item.Id;

var name = item.Name;

var sex = item.Sex;

html += "<tr><td>" + id + "</td><td>" + name + "</td><td>" + sex + "</td></tr>";

});

$("#Result").append(html); //将返回的数据追加到表格

}

});

}

});

</script>

</head>

<body>

<form id="form1" runat="server">

<table id="Result" cellspacing="0" cellpadding="0">

<tr>

<th>

编号

</th>

<th>

姓名

</th>

<th>

性别

</th>

</tr>

</table>

<div id="Pagination">

</div>

</form>

</body>

</html>

代码如下:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Text;

using System.Net;

using System.IO;

using System.Web.UI;

using System.Web.UI.WebControls;

public partial class AjaxJson : System.Web.UI.Page

{

public string pageCount = string.Empty; //总条目数

protected void Page_Load(object sender, EventArgs e)

{

if (!IsPostBack)

{

string url = "/SupplyAJAX.aspx";

string strResult = GetRequestJsonString(url, "type=getcount");

pageCount = strResult.ToString();

}

}

#region 后台获取ashx返回的数据

/// <summary>

/// 后台获取ashx返回的数据

/// </summary>

/// <param name="relativePath">地址</param>

/// <param name="data">参数</param>

/// <returns></returns>

public static string GetRequestJsonString(string relativePath, string data)

{

string requestUrl = GetRequestUrl(relativePath, data);

try

{

WebRequest request = WebRequest.Create(requestUrl);

request.Method = "GET";

StreamReader jsonStream = new StreamReader(request.GetResponse().GetResponseStream());

string jsonObject = jsonStream.ReadToEnd();

return jsonObject;

}

catch

{

return string.Empty;

}

}

public static string GetRequestUrl(string relativePath, string data)

{

string absolutePath = HttpContext.Current.Request.Url.AbsoluteUri;

string hostNameAndPort = HttpContext.Current.Request.Url.Authority;

string applicationDir = HttpContext.Current.Request.ApplicationPath;

StringBuilder sbRequestUrl = new StringBuilder();

sbRequestUrl.Append(absolutePath.Substring(0, absolutePath.IndexOf(hostNameAndPort)));

sbRequestUrl.Append(hostNameAndPort);

sbRequestUrl.Append(applicationDir);

sbRequestUrl.Append(relativePath);

if (!string.IsNullOrEmpty(data))

{

sbRequestUrl.Append("?");

sbRequestUrl.Append(data);

}

return sbRequestUrl.ToString();

}

#endregion

}

代码如下:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Data;

using System.Web.UI;

using System.Web.UI.WebControls;

//新增

using System.Web.Script.Serialization;

using System.Text;

public partial class SupplyAJAX : System.Web.UI.Page

{

protected static List<Student> StudentList = new List<Student>();

protected static int RecordCount = 0;

protected static DataTable dt = CreateDT();

protected void Page_Load(object sender, EventArgs e)

{

switch (Request["type"])

{

case "show":

#region 分页配置

//具体的页面数

int pageIndex;

int.TryParse(Request["pageIndex"], out pageIndex);

//页面显示条数

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

if (pageIndex == 0)

{

pageIndex = 1;

}

#endregion

DataTable PagedDT = GetPagedTable(dt, pageIndex, PageSize);

List<Student> list = new List<Student>();

foreach (DataRow dr in PagedDT.Rows)

{

Student c = new Student();

c.Id = (Int32)dr["Id"];

c.Name = dr["Name"].ToString();

c.Sex = dr["Sex"].ToString();

list.Add(c);

}

string json = new JavaScriptSerializer().Serialize(list);//这个很关键,否则error

StringBuilder Builder = new StringBuilder();

Builder.Append("{");

Builder.Append(""recordcount":" + RecordCount + ",");

Builder.Append(""data":");

Builder.Append(json);

Builder.Append("}");

Response.ContentType = "application/json";

Response.Write(Builder.ToString());

break;

case "getcount":

Response.Write(dt.Rows.Count);

break;

case "add":

break;

case "update":

break;

case "delete":

break;

}

Response.End();

}

#region 模拟数据

private static DataTable CreateDT()

{

DataTable dt = new DataTable();

dt.Columns.Add(new DataColumn("Id", typeof(int)) { DefaultValue = 0 });

dt.Columns.Add(new DataColumn("Name", typeof(string)) { DefaultValue = "1" });

dt.Columns.Add(new DataColumn("Sex", typeof(string)) { DefaultValue = "男" });

for (int i = 1; i <= 1000; i++)

{

dt.Rows.Add(i, "张三" + i.ToString().PadLeft(4, '0'));

}

RecordCount = dt.Rows.Count;

return dt;

}

#endregion

/// <summary>

/// 对DataTable进行分页,起始页为1

/// </summary>

/// <param name="dt"></param>

/// <param name="PageIndex"></param>

/// <param name="PageSize"></param>

/// <returns></returns>

public static DataTable GetPagedTable(DataTable dt, int PageIndex, int PageSize)

{

if (PageIndex == 0)

return dt;

DataTable newdt = dt.Copy();

newdt.Clear();

int rowbegin = (PageIndex - 1) * PageSize;

int rowend = PageIndex * PageSize;

if (rowbegin >= dt.Rows.Count)

return newdt;

if (rowend > dt.Rows.Count)

rowend = dt.Rows.Count;

for (int i = rowbegin; i <= rowend - 1; i++)

{

DataRow newdr = newdt.NewRow();

DataRow dr = dt.Rows[i];

foreach (DataColumn column in dt.Columns)

{

newdr[column.ColumnName] = dr[column.ColumnName];

}

newdt.Rows.Add(newdr);

}

return newdt;

}

/// <summary>

/// 获取总页数

/// </summary>

/// <param name="sumCount">结果集数量</param>

/// <param name="pageSize">页面数量</param>

/// <returns></returns>

public static int getPageCount(int sumCount, int pageSize)

{

int page = sumCount / pageSize;

if (sumCount % pageSize > 0)

{

page = page + 1;

}

return page;

}

public struct Student

{

public int Id;

public string Name;

public string Sex;

}

}

更多信息请查看IT技术专栏

更多信息请查看网络编程
由于各方面情况的不断调整与变化, 提供的所有考试信息和咨询回复仅供参考,敬请考生以权威部门公布的正式信息和咨询为准!

2025国考·省考课程试听报名

  • 报班类型
  • 姓名
  • 手机号
  • 验证码
关于我们 | 联系我们 | 人才招聘 | 网站声明 | 网站帮助 | 非正式的简要咨询 | 简要咨询须知 | 加入群交流 | 手机站点 | 投诉建议
工业和信息化部备案号:滇ICP备2023014141号-1 云南省教育厅备案号:云教ICP备0901021 滇公网安备53010202001879号 人力资源服务许可证:(云)人服证字(2023)第0102001523号
云南网警备案专用图标
联系电话:0871-65317125(9:00—18:00) 获取招聘考试信息及咨询关注公众号:
咨询QQ:526150442(9:00—18:00)版权所有:
云南网警报警专用图标
Baidu
map