本文實例講述了C#使用WebService結合jQuery實現無刷新翻頁的方法。分享給大家供大家參考。具體如下：
1. 首先創建數據庫、表Article，字段ArticleId,Title
前臺代碼
<%@ Page Language="C#" AutoEventWireup="true" %><!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 id="Head1" runat="server"><title></title><script src="jquery-1.6.4.min.js" type="text/javascript"></script></head><body> <form id="form1" runat="server"> <div id="result"> </div> </form> <script type="text/javascript"> var pageNo = 1; //當前頁號 var pageItems = 10; //每頁顯示的行數，這個數字與da.Fill(ds,pageNo,3,"gbook");里面的3保持一致 var MaxPage = pageItems; function showPage(m) { if (m == -1) { if (pageNo < 2) { alert("已經到了首頁"); return; }; MaxPage = pageItems; } else { if (MaxPage < pageItems) { alert("已經到了末頁"); return; }; } pageNo += m; getData(); } $(document).ready(function () { getData(); }); function getData() { $.ajax({ type: "POST", cache: false, url: "WebService3.asmx/Select", /* 注意后面的名字對應CS的方法名稱 */ data: { "pageNo": (pageNo - 1) * pageItems }, /* 注意參數的格式和名稱 */ contentType: "application/x-www-form-urlencoded", dataType: "xml", error: function (result) { alert(result.responseText); }, success: function (data) { MaxPage = $(data).find('Article').size(); /* Article是后臺輸出的表名稱,要與后臺對應 */ if (MaxPage == 0) { $("#result").html("沒有記錄"); return; } t = "<table border='1'>"; $(data).find('Article').each(function (index, ele) { /* Article是后臺輸出的表名稱,要與后臺對應 */ var ArticleId = $(ele).find('ArticleId').text(); var Title = $(ele).find('Title').text(); t += "<tr>"; t += "<td>" + ArticleId + "</td>"; t += "<td>" + Title + "</td>"; t += "</tr>"; }) t += "</table>"; t += "<div><a href='' onclick='showPage(-1);return false;'>上一頁</a> <a href='' onclick='showPage(1);return false;'>下一頁</a></div>" $("#result").html(t); } }); } </script></body></html>2. 后臺代碼
using System.Data;using System.Data.SqlClient;using System;using System.Web;using System.Web.Services;using System.Web.Services.Protocols;[WebService(Namespace = "http://tempuri.org/")][WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]//若要允許使用 ASP.NET AJAX 從腳本中調用此 Web 服務，請取消對下行的注釋[System.Web.Script.Services.ScriptService]public class WebService3 : System.Web.Services.WebService{ [WebMethod] public System.Data.DataSet Select(int pageNo) { System.Data.SqlClient.SqlConnection sqlCon = new SqlConnection(); sqlCon.ConnectionString = "server=.;uid=sa;pwd=sa;database=guestbook"; //定義SQL語句 string SqlStr = "SELECT ArticleId,Title FROM Article ORDER BY ArticleId DESC"; //實例化SqlDataAdapter對象 SqlDataAdapter da = new SqlDataAdapter(SqlStr, sqlCon); DataSet ds = new DataSet(); da.Fill(ds, pageNo, 10, "Article"); return ds; }}希望本文所述對大家的C#程序設計有所幫助。
新聞熱點
疑難解答
