C#使用WebService结合jQuery实现无刷新翻页的方法
本文实例讲述了C#使用WebService结合jQuery实现无刷新翻页的方法。分享给大家供大家参考。具体如下：
1.首先创建数据库、表Article，字段ArticleId,Title
前台代码
<%@PageLanguage="C#"AutoEventWireup="true"%>
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<headid="Head1"runat="server">
<title></title>
<scriptsrc="jquery-1.6.4.min.js"type="text/javascript"></script>
</head>
<body>
<formid="form1"runat="server">
<divid="result">
</div>
</form>
<scripttype="text/javascript">
varpageNo=1;//当前页号
varpageItems=10;//每页显示的行数，这个数字与da.Fill(ds,pageNo,3,"gbook");里面的3保持一致
varMaxPage=pageItems;
functionshowPage(m){
if(m==-1){
if(pageNo<2){
alert("已经到了首页");
return;
};
MaxPage=pageItems;
}
else{
if(MaxPage<pageItems){
alert("已经到了末页");
return;
};
}
pageNo+=m;
getData();
}
$(document).ready(function(){
getData();
});
functiongetData(){
$.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="<tableborder='1'>";
$(data).find('Article').each(function(index,ele){
/*Article是后台输出的表名称,要与后台对应*/
varArticleId=$(ele).find('ArticleId').text();
varTitle=$(ele).find('Title').text();
t+="<tr>";
t+="<td>"+ArticleId+"</td>";
t+="<td>"+Title+"</td>";
t+="</tr>";
})
t+="</table>";
t+="<div><ahref=''onclick='showPage(-1);returnfalse;'>上一页</a><ahref=''onclick='showPage(1);returnfalse;'>下一页</a></div>"
$("#result").html(t);
}
});
}
</script>
</body>
</html>
2.后台代码
usingSystem.Data;
usingSystem.Data.SqlClient;
usingSystem;
usingSystem.Web;
usingSystem.Web.Services;
usingSystem.Web.Services.Protocols;
[WebService(Namespace="http://tempuri.org/")]
[WebServiceBinding(ConformsTo=WsiProfiles.BasicProfile1_1)]
//若要允许使用ASP.NETAJAX从脚本中调用此Web服务，请取消对下行的注释
[System.Web.Script.Services.ScriptService]
publicclassWebService3:System.Web.Services.WebService
{
[WebMethod]
publicSystem.Data.DataSetSelect(intpageNo)
{
System.Data.SqlClient.SqlConnectionsqlCon=newSqlConnection();
sqlCon.ConnectionString="server=.;uid=sa;pwd=sa;database=guestbook";
//定义SQL语句
stringSqlStr="SELECTArticleId,TitleFROMArticleORDERBYArticleIdDESC";
//实例化SqlDataAdapter对象
SqlDataAdapterda=newSqlDataAdapter(SqlStr,sqlCon);
DataSetds=newDataSet();
da.Fill(ds,pageNo,10,"Article");
returnds;
}
}
希望本文所述对大家的C#程序设计有所帮助。