返回首页
当前位置: 主页 > 网络编程 > Ajax实例教程 >

GridView AJAX 局部刷新分页实例代码

时间:2011-06-03 11:19来源:知行网www.zhixing123.cn 编辑:麦田守望者

ASPX 代码
 

<%@ Page Language="C#" %>

<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.OleDb" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
int PageIndex = 1;
private String ConnectionString = @"Provider=Microsoft.Jet.OLEDB.4.0;Data Source=|DataDirectory|MengXianHui.mdb;";
public int TotalCount = 0;
public int PageItem = 5;
System.Data.DataView CreateDataSourceByXianhuiMeng()
{
Int32.TryParse(Request.QueryString["Page"], out PageIndex);
OleDbCommand cmd;
String sql;
OleDbConnection cn = new OleDbConnection(ConnectionString);
cn.Open();
// 由于是 Access 数据库,我们只进行简单的分页。对于性能要求较高的地方,请自行采取其他方法,比如存储过程等。
sql = "SELECT COUNT(*) FROM [Document]";
cmd = new OleDbCommand(sql, cn);

// 总的记录数
TotalCount = Convert.ToInt32(cmd.ExecuteScalar());
//当前页的序号
if (PageIndex < 1) PageIndex = 1;
int PageCount = (int)Math.Ceiling((double)(TotalCount) / PageItem);
if (PageIndex > PageCount) PageIndex = PageCount;
int startRecord = (PageIndex - 1) * PageItem;

sql = "SELECT DocumentId,DocumentGuid,Title,CreateDate FROM [Document] ORDER BY [DocumentId] DESC";

OleDbDataAdapter da = new OleDbDataAdapter(sql, cn);
DataSet ds = new DataSet();
da.Fill(ds, startRecord, PageItem, "Document");
cn.Close();
return ds.Tables[0].DefaultView;
}
 

protected void Page_Load(object sender, EventArgs e)
{
if (String.IsNullOrEmpty(Request.QueryString["Page"]))
{
//首次加载显示页面内容,并进行初始化参数。
CreateDataSourceByXianhuiMeng();
Page.ClientScript.RegisterStartupScript(Page.GetType(), "js", "Pager(1)", true);
}
else
{
Response.ClearContent();
GridView1.DataSource = CreateDataSourceByXianhuiMeng();
GridView1.DataBind();
System.Text.StringBuilder sb = new System.Text.StringBuilder();
System.IO.StringWriter sw = new System.IO.StringWriter(sb);
HtmlTextWriter htw = new HtmlTextWriter(sw);
GridView1.RenderControl(htw);
Response.Write(sb.ToString());
Response.End();
}

}
/// 添加这个override void VerifyRenderingInServerForm(Control control),是为了避免出现
/// 类型“GridView”的控件“GridView1”必须放在具有 runat=server 的窗体标记内。
/// 的异常
public override void VerifyRenderingInServerForm(Control control)
{ }

</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>简单 AJAX 局部刷新分页例子</title>
<script type="text/javascript">
function GetData(p) {
var h = window.XMLHttpRequest ? new window.XMLHttpRequest() : new ActiveXObject("MSXML2.XMLHTTP");
h.open("GET", '<%=Request.FilePath %>?Page=' + p + "&" + Date.parse(new Date()), true);
h.onreadystatechange = function() {
if (h.readyState == 4) {
if (h.status == 200) {
document.getElementById("_Containter").innerHTML = h.responseText;
}
}
}
h.send(null);
}

///
/// 具有分页功能的函数。
///
function Pager(CurrentPage) {
GetData(CurrentPage);
var TotalRows = <%=TotalCount %>;
var Step = 3;
var PageItem = <%=PageItem %>;

if (TotalRows < 1) {
TotalPage = 0;
}
else {
TotalPage = Math.ceil(TotalRows / PageItem)
}
var PagerContent = "共 " + TotalPage + " 页 每页 " + PageItem + " 条 ";
var leftStep = CurrentPage - Step;
var rightStep = CurrentPage + Step;
if (leftStep < 1) leftStep = 1;
if (rightStep > TotalPage) rightStep = TotalPage;
if (CurrentPage > 1) PagerContent += "<a href='#' onclick='Pager(1);return false;'>首页</a> <a href='' onclick='Pager(" + (CurrentPage - 1) + ");return false;'>上一页</a> "
for (var i = leftStep; i <= rightStep; i++) {
if (i == CurrentPage) {
PagerContent += " <strong style='color:red'>" + i + "</strong>"
}
else {
PagerContent += " <a href='#' onclick='Pager(" + i + ");return false;'>" + i + "</a> "
}
}

if (rightStep < TotalPage) PagerContent += "<a href='' onclick='Pager(" + (CurrentPage + 1) + ");return false;'>下一页</a> <a href='' onclick='Pager(" + TotalPage + ");return false;'>末页</a> "
document.getElementById("_Pager1").innerHTML= document.getElementById("_Pager2").innerHTML = PagerContent;
}
alert("页面首次加载弹出的标记。")
</script>

</head>
<body>
<form id="form1" runat="server">
<div id="_Pager1" style="padding: 10px; text-align: center"></div>
<div id="_Containter">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" Width="80%">
<HeaderStyle BackColor="#EEEEEE" />
<Columns>
<asp:BoundField DataField="DocumentId" />
<asp:HyperLinkField HeaderText="文章标题" DataNavigateUrlFields="DocumentGuid" DataTextField="Title"
DataNavigateUrlFormatString="http://dotnet.aspx.cc/article/{0}/read.aspx" />
<asp:BoundField HeaderText="发布时间" DataField="CreateDate" />
</Columns>
</asp:GridView>
</div>
<div id="_Pager2" style="padding: 10px; text-align: center"></div>
</form>
</body>
</html>
 

顶一下
(2)
100%
踩一下
(0)
0%
标签(Tag):ajax
------分隔线----------------------------
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
验证码:点击我更换图片