您的位置:首页 > Web前端 > JQuery

ajax-jquery无刷新分页

2012-11-16 20:01 267 查看
2012-05-15 22:10

 

   前台JS代码:

//ajax无刷新分页
function btnList() {
var current = 1;
$.post("NoRefreshPage.ashx", { "action": "pagenum" }, function (data, status) {//func开始
if (status == "success") {//if开始
$("#trPage").empty();
$("#trPage").append("<td title=tdprev><a href=''>上一页</a></td>"); //添加上一页
$("#trPage td[title='tdprev']").click(function (e) {
e.preventDefault();
if (parseInt(current) > 1) { $("#trPage td[title=td" + (current - 1) + "]").click(); }
else alert("已经在首页");
});

for (var i = 1; i <= data; i++) {  //for开始
var tdPage = "<td title=td" + i + "><a href=''>" + i + "</a></td>";
$("#trPage").append(tdPage);
} //for循环结束

$("#trPage").append("<td title=tdnext><a href=''>下一页</a></td>"); //添加下一页
$("#trPage td[title='tdnext']").click(function (e) {
e.preventDefault();
if (parseInt(current) < parseInt(data)) { current++; $("#trPage td[title=td" + current + "]").click(); }
else { alert("已经在末页"); }
});
$("#trPage td").click(
function (e) {//func2开始
e.preventDefault(); //取消导向链接
if ($(this).text() != "上一页" && $(this).text() != "下一页")
current = $(this).text(); //记录当前页
//alert(current);
$.post("NoRefreshPage.ashx", { "action": "page", "pageindex": $(this).text() },
function (data, status) { //func3开始
if (status == "success") {//if2开始
var list = $.parseJSON(data);
$("#order").empty();
for (var i = 0; i < list.length; i++) {//for开始
var li = $("<li >orderid=" + list[i].orderid + "| customid=" + list[i].customid
+ "| employid=" + list[i].employid + "   <a id=" + list[i].orderid + " href=''>   删除</a></li>");
$("#order").append(li);
} //for循环结束

$("#order li a").click(function (e) {//绑定 删除 事件
e.preventDefault();
// alert($(this).attr("id"));
if (confirm("确认删除")) {//确认提示
$.post("NoRefreshPage.ashx", { "action": "remove", "rid": $(this).attr("id") },
function (data, status) {
if (status == "success") {
if (data == "ok") {

$("#order li:eq(" + this + ")").remove();
$("#trPage td[title=td" + current + "]").click(); //单击重新获取当前页.
}
else { alert("错误"); }

} //if
else { alert("删除失败"); }
} // fun end
); //post  end
}
}); //绑定删除事件结束
} //if2结束
else { alert("错误页码"); }
} //func3结束
); //post结束
}); //func2、页码事件结束
} //if结束/
else { alert("获取分页失败"); }
});                                     //func、post结束/
} //整个函数结束


 

代码比较乱,没有具体函数化,注释已经和清晰。

前台html代码:

<div>
<ul id="order"></ul>
<table><tr id="trPage"></tr></table>
<input type="button" id="Button1" onclick="btnList()" value="显示分页" />
</div>


 

后台C#代码(该代码在一般处理程序中写):

   

public class NoRefreshPage : IHttpHandler
{
static string sqlstr =@"Data Source=.\sqlexpress;Initial Catalog=Northwind;Integrated Security=True";
SqlConnection sqlconn = new SqlConnection(sqlstr);
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
string action = context.Request["action"];
if (action == "pagenum")
{

context.Response.Write( GetPageNum());

}
else if (action == "page")
{
int pageindex=Convert.ToInt32( context.Request["pageindex"]);
string jsText = GetContextByPageIndex(pageindex);
context.Response.Write(jsText);
}
else if (action == "remove")
{
string OrderID = context.Request["rid"];
int result = DelOrdersByID(OrderID);
if (result >= 0)
{
context.Response.Write("ok");
}
}
}
/// <summary>
/// 根据ID删除对应的数据行
/// </summary>
/// <param name="OrderID">ID</param>
/// <returns>受影响行数</returns>
private int DelOrdersByID(string OrderID)
{
string sql = "delete from orders where OrderID=@OrderID";
SqlCommand cmd = new SqlCommand(sql, sqlconn);
cmd.Parameters.AddWithValue("OrderID", OrderID);
sqlconn.Open();
int result = cmd.ExecuteNonQuery();
sqlconn.Close();
return result;
}
/// <summary>
/// 根据页索引获取对应的数据
/// </summary>
/// <param name="pageindex">页索引</param>
/// <returns>经过JSON序列化的字符串</returns>
privat
4000
e string GetContextByPageIndex(int pageindex)
{
string sql = "select * from ( select *,ROW_NUMBER() over(order by orderid)  rownum  " +
" from orders where OrderID between 10263 and 10611 ) temp " +
" where temp.rownum >=@startindex and temp.rownum<=@endindex";//这边应该使用存储过程,测试作用,直接写sql语句了.
SqlDataAdapter sda = new SqlDataAdapter(sql, sqlconn);
DataSet ds = new DataSet();
sda.SelectCommand.Parameters.AddWithValue("startindex", (pageindex - 1) * 10 + 1);
sda.SelectCommand.Parameters.AddWithValue("endindex", pageindex * 10);
sda.Fill(ds, "order");
List<Orders> list = new List<Orders>();
foreach (DataRow dr in ds.Tables[0].Rows)
{
list.Add(new Orders { orderid = dr[0].ToString(), customid = dr[1].ToString(), employid = dr[2].ToString() });
}
JavaScriptSerializer jss = new JavaScriptSerializer();
string jsText = jss.Serialize(list);
return jsText;
}
/// <summary>
///  获取总页数
/// </summary>
/// <param name="oneRow">每页行数</param>
/// <returns>总页数</returns>
private int GetPageNum(int oneRow)
{
string sql = "select count(*) from orders where OrderID between 10263 and 10611";
SqlCommand cmd = new SqlCommand(sql, sqlconn);
sqlconn.Open();
int rownum = Convert.ToInt32(cmd.ExecuteScalar());
sqlconn.Close();
if (rownum % oneRow != 0)
{
rownum++;
}
return rownum / oneRow;
}


 

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息