不使用Asp控件实现无刷新分页

loveblessedes 2012-03-28 10:54:31

-----------------------我已经把数据查询出来了
totalPage总页数 pageSize每页显示几条数据 currPage当前显示第几页
List<InvitationInfo> objInvitationInfo = objInvitationInfoManager.GetInvitationInfoPage(ref totalPage, pageSize, currPage);
我的代码是这样写的在前台我写了一个div id是divInfo 我在后台用的
foreach (InvitationInfo item in objInvitationInfo)
{
sb.AppendFormat("<tr><td>{0}</td></tr>", item.User.UserName);
sb.AppendFormat("<tr><td>{0}</td></tr>", item.InvitationTime);
sb.AppendFormat("<tr><td>{0}</td></tr>", item.InvitationContent);
}
这样的方式显示的数据
----------------------现在问题来了
我想实现无刷新分页使用的技术必须是jquery + jaxa
我想把上面的代码换个方式呈现出来那就是使用无刷新我不知道改怎么写求大侠们帮我指导指导

...全文

82 1 打赏收藏转发到动态举报

写回复

用AI写文章

1 条回复

切换为时间正序

请发表友善的回复…

发表回复

yuzan0123 2012-03-30

打赏
举报

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="SaleChance.aspx.cs" Inherits="SaleChance" %>

<!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>
<title></title>
<link href="CSS/Style1.css" rel="stylesheet" type="text/css" />
<script src="JS/json.js" type="text/javascript"></script>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script src="JS/MyAjax.js" type="text/javascript"></script>
<script language="javascript">
//var ChanID;

function del(obj) {

if (confirm("您确定要永久删除这条记录吗？")) {

AjaxMethod("GET", "DelSale.aspx?index=" + obj.key + "", null, function (v) {
if(v == "ok")
{
document.getElementById("tbe").deleteRow(obj.parentNode.parentNode.rowIndex);
//alert("成功");
}
else{
alert("失败");
}

});
}
}
function showEdit() {
//参数：在弹出窗体使用window.dialogArguments获取
//returnValue：为弹出窗体的返回值，在弹出窗体设置window.returnValue
var returnValue = window.showModalDialog("EditSale.aspx?data=" + Math.random(), "参数", "dialogWidth:600px;dialogHeight:300px;help:no");
setPageIndex(1);
}
function ShowMode(obj) {
var id = obj.key;
var pra = {"ChanID":id};
//参数：在弹出窗体使用window.dialogArguments获取
//returnValue：为弹出窗体的返回值，在弹出窗体设置window.returnValue
var returnValue = window.showModalDialog("ShowEditOk.aspx?data=" + Math.random(), pra, "dialogWidth:600px;dialogHeight:300px;help:no");
setPageIndex(curIndex);
}

//保存了当前页，默认的时候是在第一页
var curIndex = 1;
//在客户端分页的方法，index参数是当前的页码数
window.onload = function () {
setPageIndex(curIndex);
}

function setPageIndex(index) {
// document.getElementById("ckall").checked = false;
//每次调用方法的时候改变页码数
curIndex = index;

AjaxMethod("GET", "GetDataPages.aspx?index=" + curIndex + "", null, function (v) {
//alert(v);
var data = JSON.parse(v);

// alert(data["maxCount"]);
//分页的结果
var ds = data["rel"];

var tbs = document.getElementById("tbe");
//不管表里面有木有数据，先去删除除了表头了表尾的数据.
while (tbs.rows.length >1) {
tbs.deleteRow(1);
}
//把数据添加到表格里面
for (var i in ds) {
var row = tbs.insertRow(-1);
row.insertCell(-1).innerText = ds[i]["ChanName"];
row.insertCell(-1).innerText = ds[i]["ChanTitle"];
row.insertCell(-1).innerText = ds[i]["ChanLinkMan"];
row.insertCell(-1).innerText = ds[i]["ChanLinkTel"];
row.insertCell(-1).innerText = ds[i]["ChanCreateDate"];
row.insertCell(-1).innerHTML = "<img title='修改' key ='"+ds[i]["ChanID"]+" ' src='Images/edt.gif' onclick='ShowMode(this)' />  <img title='删除' src='Images/del.gif' key ='"+ds[i]["ChanID"]+"' onclick = 'del(this)'/>";
}
// ChanID = ds[i]["ChanID"];

document.getElementById("s2").onclick = function () {
//下一页
var next = curIndex == parseInt(data["maxCount"]) ? parseInt(data["maxCount"]) : curIndex + 1;

setPageIndex(next);
}

document.getElementById("s1").onclick = function () {

var pre = curIndex == 1 ? 1 : curIndex - 1;

setPageIndex(pre);
}

document.getElementById("s").onclick = function () {

curIndex = 1;
setPageIndex(curIndex);
}

document.getElementById("s3").onclick = function () {

var last = parseInt(data["maxCount"]);

setPageIndex(last);
}

document.getElementById("a1").innerText = "当前是在【" + curIndex + "】页";

document.getElementById("a2").innerText = "共【" + data["maxCount"] + "】页";
document.getElementById("go").onclick = function () {
var txt = document.getElementById("t1").value;

if (!isNaN(txt)) {
var p_index = parseInt(txt);
curIndex = p_index;
setPageIndex(curIndex);
}
else {
alert("no");
}
}
});
}

</script>
</head>
<body>
<div id="desDiv">
<span>销售机会管理</span><br />
创建和维护销售机会
</div>
<div id="dataDiv">
<div id="headDiv">
<img src="Images/22.gif" />  <a href="javascript:showEdit()">新建</a>
</div>
<table class="dataTable" id = "tbe">
<tr>
<th>客户名称</th>
<th>概要</th>
<th>联系人</th>
<th>联系电话</th>
<th>创建时间</th>
<th>操作</th>
</tr>
<tr>
<%-- <td colspan="10" align=right>
<div id="Div1">
<img id="Img1" src="Images/first.gif" />
<img id="Img2" src="Images/back.gif" />
<img id="Img3" src="Images/next.gif" />
<img id="Img4" src="Images/last.gif" />
转到第<input type="text" size="1" />  <input type="image" src="Images/go.gif" />
</div>
</td>--%>
<%-- <td></td>
<td></td>
<td></td>
<td></td>
<td><img title="修改" src="Images/edt.gif" onclick="showEdit()" />  <img title="删除" src="Images/del.gif" onclick = "del(this)"/></td>--%>
</tr>
</table>
<div id="pageDiv">
<div><span id = "a1"></span><span id = "a2"></span></div>
<div id="rightPage">
<img id="s" src="Images/first.gif" />
<img id="s1" src="Images/back.gif" />
<img id="s2" src="Images/next.gif" />
<img id="s3" src="Images/last.gif" />
转到第<input type="text" size="1" id="t1" />  <input type="image" src="Images/go.gif" id="go"/>
</div>
</div>
</div>
</body>
</html>