AJAX和三層架構(gòu)實(shí)現(xiàn)分頁功能具體思路及代碼

更新時(shí)間：2013年05月21日 16:49:40 作者：

本文涉及到AJAX和三層架構(gòu)方面的知識(shí)，在學(xué)習(xí)分頁的同時(shí)也鞏固了一下它們的相關(guān)知識(shí)，適合初學(xué)者的你

 
-----------------------------HTMLPage1.htm--------------------------------- 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title></title> 
<style type="text/css"> 
table{ border:solid 1px #444; background-color:Aqua;} 
table td{border:solid 1px #444;} 
</style> 
<script src="js/Jquery1.7.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function () { 
var pageindex = 1; 
var pagesize = 10; 
var lastpageindex = 1; 
loaddata(); 
function loaddata() { 
$.ajax({ 
type: "post", 
contentType: "application/json", 
url: "WebService1.asmx/GetListAjax", 
data: "{pagesize:" + pagesize + ",pageindex:" + pageindex + "}", 
success: function (result) { 
var strtable = '<table>'; 
strtable += '<tr><td>編號(hào)</td><td>標(biāo)題</td><td>內(nèi)容</td><td>創(chuàng)建時(shí)間</td></tr>'; 
for (var i = 0; i < result.d.length; i++) { 
strtable += '<tr>'; 
strtable += '<td>' + result.d[i].Id + '</td>'; 
strtable += '<td>' + result.d[i].NewsTitle + '</td>'; 
strtable += '<td>' + result.d[i].NewsContent + '</td>'; 
strtable += '<td>' + result.d[i].CreateTime + '</td>'; 
strtable += '</tr>'; 
} 
strtable += '</table>'; 
$('#mydiv').html(strtable); 
} 
}) 
} 
$.ajax({ 
type: "post", 
contentType: "application/json", 
url: "WebService1.asmx/GetLastPageindex", 
data: "{pagesize:" + pagesize + "}", 
success: function (result) { 
lastpageindex = result.d; 
} 
}) 
//第一頁 
$('a:first').click(function () { 
pageindex = 1; 
loaddata(); 
}) 
//上一頁 
$('#divfenye a:eq(1)').click(function () { 
if (pageindex > 1) { 
pageindex--; 
loaddata(); 
} 
}) 
//下一頁 
$('#divfenye a:eq(2)').click(function () { 
if (pageindex < lastpageindex) { 
pageindex++; 
loaddata(); 
} 
}) 
//最后一頁 
$('#divfenye a:eq(3)').click(function () { 
pageindex = lastpageindex; 
loaddata(); 
}) 
$('#divfenye a:last').click(function () { 
pageindex = $('#txtPageindex').val(); 
loaddata(); 
}) 
$('#txtPageindex').focus(function () { 
$(this).val(''); 
}) 
}) 
</script> 
</head> 
<body> 
<div id="mydiv"> 
</div> 
<div id="divfenye"><a href="#">第一頁</a><a href="#">上一頁</a><a href="#">下一頁</a><a href="#">最后一頁</a><input 
id="txtPageindex" type="text" /><a href="#">Go</a></div> 
</body> 
</html> 
-------------------------WebService1 -------------------------------- 
// 若要允許使用 ASP.NET AJAX 從腳本中調(diào)用此 Web 服務(wù)，請(qǐng)取消對(duì)下行的注釋。 
[System.Web.Script.Services.ScriptService] 
public class WebService1 : System.Web.Services.WebService 
{ 
[WebMethod] 
public string HelloWorld() 
{ 
return "Hello World"; 
} 
[WebMethod] 
public List<Model.T_News1> GetListAjax(int pagesize, int pageindex) 
{ 
BLL.T_News1 bnews = new BLL.T_News1(); 
DataTable dt = bnews.GetListDataTable(pagesize, pageindex); 
List<Model.T_News1> list = new List<Model.T_News1>(); 
int Id; 
string newstitle = ""; 
string newscontent = ""; 
DateTime createtime; 
for (int i = 0; i < dt.Rows.Count; i++) 
{ 
Id = Convert.ToInt32(dt.Rows[i]["Id"]); 
newstitle = dt.Rows[i]["NewsTitle"].ToString(); 
newscontent = dt.Rows[i]["NewsContent"].ToString(); 
createtime = Convert.ToDateTime(dt.Rows[i]["CreateTime"]); 
Model.T_News1 news = new Model.T_News1() 
{ 
Id = Id, 
NewsTitle = newstitle, 
NewsContent = newscontent, 
CreateTime = createtime 
}; 
list.Add(news); 
} 
return list; 
} 
[WebMethod] 
public int GetLastPageindex(int pagesize) 
{ 
BLL.T_News1 bnews = new BLL.T_News1(); 
int totalcount = bnews.GetRecordCount(""); 
if (totalcount % pagesize == 0) 
{ 
return totalcount / pagesize; 
} 
else 
{ 
return totalcount / pagesize + 1; 
} 
} 
------------------------------DAL層：-------------------------- 
/// <summary> 
/// 分頁獲取數(shù)據(jù)列表 
/// </summary> 
public DataTable GetListDataTable(int PageSize, int PageIndex) 
{ 
SqlParameter[] parameters = { 
new SqlParameter("@PageSize", SqlDbType.Int), 
new SqlParameter("@PageIndex", SqlDbType.Int) 
}; 
parameters[0].Value = PageSize; 
parameters[1].Value = PageIndex; 
return DbHelperSQL.RunProcedureDataTable("pro_fenye", parameters); 
} 
--------------------BLL層：-------------------------- 
public DataTable GetListDataTable(int pagesize, int pageindex) 
{ 
return dal.GetListDataTable(pagesize, pageindex); 
} 
------------------DbHelperSQL:----------------------- 
public static DataTable RunProcedureDataTable(string storedProcName, IDataParameter[] parameters) 
{ 
using (SqlConnection connection = new SqlConnection(connectionString)) 
{ 
DataTable dt = new DataTable(); 
connection.Open(); 
SqlDataAdapter sqlDA = new SqlDataAdapter(); 
sqlDA.SelectCommand = BuildQueryCommand(connection, storedProcName, parameters); 
sqlDA.Fill(dt); 
connection.Close(); 
return dt; 
} 
} 