新聞中心
做Web開發(fā)的程序員,分頁(yè)時(shí)在所難免的,微軟GridView、AspPager等設(shè)置分頁(yè)數(shù)據(jù)可以自動(dòng)分頁(yè),但是這里瀏覽器會(huì)閃動(dòng),用戶體驗(yàn)不是很友好,在此我整理了JQuery實(shí)現(xiàn)分頁(yè),并且使用。

成都創(chuàng)新互聯(lián)堅(jiān)持“要么做到,要么別承諾”的工作理念,服務(wù)領(lǐng)域包括:網(wǎng)站設(shè)計(jì)、做網(wǎng)站、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù),滿足客戶于互聯(lián)網(wǎng)時(shí)代的丹寨網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求,幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴!
JQuery綁定模板,顯示數(shù)據(jù)
首先Default.aspx頁(yè)面需要引用的JS文件
JQuery采用 1.4.1.1 下載地址:http://pan.baidu.com/share/link?shareid=3024434948&uk=2920032010
JQuery數(shù)據(jù)顯示模板JS 下載地址:http://pan.baidu.com/share/link?shareid=3030793948&uk=2920032010
分頁(yè)按鈕樣式 下載地址:http://pan.baidu.com/share/link?shareid=3146737028&uk=2920032010
Default.aspx頁(yè)面js代碼,如下,每頁(yè)條數(shù)可以自定義,也可以放置配置文件中,queryString函數(shù)是根據(jù)URL參數(shù)名稱,獲取參數(shù)的值
Default.aspx頁(yè)面Form代碼如下,頁(yè)面數(shù)據(jù)使用JQuery jTemplates綁定數(shù)據(jù),非常方便,只需設(shè)置JSON格式數(shù)據(jù),引用JS文件即可
ID 姓名 年齡 - {#foreach $T.table as record}
{$T.record.Id} - {$T.record.Name}
- {$T.record.Age}
- {#/for}
$T.record.Id 中Id對(duì)應(yīng)的是實(shí)體類Id屬性
#p#
上面Javascript方法中用到Member_Ajax.aspx頁(yè)面代碼如下,注意:這里是將數(shù)據(jù)已JSON格式輸出到頁(yè)面,配合JQuery數(shù)據(jù)模板使用,所有Member_Ajax.aspx頁(yè)面,不應(yīng)該包含Html標(biāo)簽,其代碼格式如下
- <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Member_Ajax.aspx.cs" Inherits="Nick.Kuang.Web.Member_Ajax" %>
Member_Ajax.aspx cs頁(yè)面代碼
- protected void Page_Load(object sender, EventArgs e)
- {
- Response.Write(GetAll());
- }
- private string GetAll()
- {
- List
list = new List (); - for (int i = 0; i < 100; i++)
- {
- list.Add(new Student { Id = i, Name = "Name" + i, Age = i });
- }
- int pageIndex = GetPage();
- int pageSize = StrToInt(QueryString("pagesize"), 10); ;
- JavaScriptSerializer javascriptSerializer = new JavaScriptSerializer();
- string result = javascriptSerializer.Serialize(list.Skip(pageSize * (pageIndex - 1)).Take(pageSize).ToList());
- string response = "{\"result\" :\"1\"," +
- "\"returnval\" :\"操作成功\"," +
- "\"pagebar\" :\"" + PageBar.GetPageBar(3, "js", 2, list.Count, pageSize, pageIndex, "javascript:ajaxList(<#page#>);") + "\"," +
- "\"" + "totalCountStr" + "\":" + 10 + ",\"" + "table" + "\":" + result +
- "}";
- return response;
- }
- private static int GetPage()
- {
- int page = StrToInt(QueryString("pageIndex"), 0) < 1 ? 1 : StrToInt(QueryString("pageIndex"), 0);
- return page;
- }
- private static int StrToInt(string value, int defaultValue)
- {
- if (IsNumeric(value))
- return int.Parse(value);
- else
- return defaultValue;
- }
- ///
- /// 獲取querystring
- ///
- /// 參數(shù)名
- ///
返回值 - private static string QueryString(string s)
- {
- if (HttpContext.Current.Request.QueryString[s] != null && HttpContext.Current.Request.QueryString[s] != "")
- {
- return SafetyQueryS(HttpContext.Current.Request.QueryString[s].ToString());
- }
- return string.Empty;
- }
- ///
- /// 將字符串中的一些標(biāo)簽過(guò)濾
- ///
- ///
- ///
- private static string SafetyQueryS(string theString)
- {
- string[] aryReg = { "'", ";", "\"", "\r", "\n", "<", ">" };
- for (int i = 0; i < aryReg.Length; i++)
- {
- theStringtheString = theString.Replace(aryReg[i], string.Empty);
- }
- return theString;
- }
- private static bool IsNumeric(string value)
- {
- System.Text.RegularExpressions.Regex myRegex = new System.Text.RegularExpressions.Regex("^[-]?[1-9]*[0-9]*$");
- if (value.Length == 0)
- {
- return false;
- }
- return myRegex.IsMatch(value);
- }
使用JavaScriptSerializer中的Serialize方法可以將Object類型數(shù)據(jù)轉(zhuǎn)換成JSON格式的數(shù)據(jù),告別以前拼接成字串的方法
Student實(shí)體類代碼屬性
- public class Student
- {
- public int Id { get; set; }
- public string Name { get; set; }
- public int Age { get; set; }
- }
#p#
分頁(yè)中用到的PageBar類代碼,分頁(yè)調(diào)用Default.aspx中ajaxList函數(shù),實(shí)現(xiàn)無(wú)刷新分頁(yè)
- public class PageBar
- {
- ///
- /// 完整模式:數(shù)字+上下頁(yè)+首末+總記錄信息+指定頁(yè)碼翻轉(zhuǎn)
- ///
- ///
- ///
- ///
- ///
- ///
- ///
- ///
- ///
- ///
- ///
- ///
- private static string GetDetailbar(string stype, int stepNum, int pageRoot, int pageFoot, int pageCount, int countNum, int pageSize, int currentPage, string Http1, string HttpM, string HttpN, int limitPage)
- {
- StringBuilder sb = new StringBuilder();
- sb.Append("
");");- //sb.Append("共" + countNum.ToString() + "條,當(dāng)前第" + currentPage.ToString() + "/" + pageCount.ToString() + "頁(yè) ");
- sb.Append("共" + countNum.ToString() + "條記錄/" + pageCount.ToString() + "頁(yè) ");
- if (countNum > pageSize)
- {
- if (currentPage != 1)//只要不是***頁(yè)
- sb.Append("«");
- if (pageRoot > 1)
- {
- sb.Append("1..");
- }
- if (stepNum > 0)
- {
- for (int i = pageRoot; i <= pageFoot; i++)
- {
- if (i == currentPage)
- sb.Append("" + i.ToString() + "");
- else
- sb.Append("" + i.ToString() + "");
- if (i == pageCount)
- break;
- }
- }
- if (pageFoot < pageCount)
- {
- sb.Append(".." + pageCount + "");
- }
- if (currentPage != pageCount)//只要不是***一頁(yè)
- sb.Append("»");
- if (stype == "html")
- sb.Append("轉(zhuǎn)到第 ',this.value); return false;}\" /> 頁(yè)");
- }
- sb.Append("
- return sb.ToString();
- }
- ///
- /// 分頁(yè)導(dǎo)航
- ///
- /// 支持1=simple,2=normal,3=full
- /// html/js,只有當(dāng)stype為html且mode為3的時(shí)候顯示任意頁(yè)的轉(zhuǎn)向
- /// 步數(shù),如果步數(shù)為i,則每頁(yè)的數(shù)字導(dǎo)航就有2i+1
- /// 記錄總數(shù)
- /// 每頁(yè)記錄數(shù)
- /// 當(dāng)前頁(yè)碼
- /// 第1頁(yè)的鏈接地址模板,支持js
- /// 第M頁(yè)的鏈接地址模板,支持js,M不大于limitPage
- /// 第N頁(yè)的鏈接地址模板,支持js,N大于limitPage
- ///
- ///
- public static string GetPageBar(int mode, string stype, int stepNum, int countNum, int pageSize, int currentPage, string Http1, string HttpM, string HttpN, int limitPage)
- {
- string pagebar = "";
- //if (countNum > pageSize)
- //{
- int pageCount = countNum % pageSize == 0 ? countNum / pageSize : countNum / pageSize + 1;
- currentPage = currentPage > pageCount ? pageCount : currentPage;
- currentPage = currentPage < 1 ? 1 : currentPage;
- int stepageSize = stepNum * 2;
- int pageRoot = 1;
- int pageFoot = pageCount;
- pageCount = pageCount == 0 ? 1 : pageCount;
- if (pageCount - stepageSize < 1)//頁(yè)數(shù)比較少
- {
- pageRoot = 1;
- pageFoot = pageCount;
- }
- else
- {
- pageRoot = currentPage - stepNum > 1 ? currentPage - stepNum : 1;
- pageFoot = pageRoot + stepageSize > pageCount ? pageCount : pageRoot + stepageSize;
- pageRoot = pageFoot - stepageSize < pageRoot ? pageFoot - stepageSize : pageRoot;
- }
- pagebar = GetDetailbar(stype, stepNum, pageRoot, pageFoot, pageCount, countNum, pageSize, currentPage, Http1, HttpM, HttpN, limitPage);
- return pagebar;
- }
- public static string GetPageBar(int mode, string stype, int stepNum, int countNum, int pageSize, int currentPage, string HttpN)
- {
- return GetPageBar(mode, stype, stepNum, countNum, pageSize, currentPage, HttpN, HttpN, HttpN, 0);
- }
- public static string GetPageUrl(int chkPage, string Http1, string HttpM, string HttpN, int limitPage)
- {
- string Http = string.Empty;
- if (chkPage == 1)
- Http = Http1;
- else
- Http = (chkPage > limitPage || limitPage == 0) ? HttpN : HttpM;
- return Http.Replace("<#page#>", chkPage.ToString());
- }
- }
代碼基本上寫好了,希望對(duì)大家有用,一起學(xué)習(xí),一起進(jìn)步。
網(wǎng)站欄目:JQuery實(shí)現(xiàn)分頁(yè)程序代碼
網(wǎng)頁(yè)網(wǎng)址:http://m.5511xx.com/article/dhsdcee.html


咨詢
建站咨詢
