jquery+json处理分页的一个简单例子。
处理类:
-
C# code
-
#region
GetJsonData
///
<summary>
///
得到JSON数据
///
</summary>
///
<param name="ds">
dataset
</param>
///
<param name="KeyFileds">
查找的字段,例: id,name,content
</param>
///
<returns></returns>
public
static
string
GetJsonData(DataSet ds,
string
KeyFileds) { StringBuilder html
=
new
StringBuilder();
string
[] AList; AList
=
KeyFileds.Split(
'
,
'
); html.Append(
"
[
"
);
for
(
int
i
=
0
; i
<
ds.Tables[
0
].Rows.Count; i
++
) { html.Append(
"
{
"
);
int
j
=
0
;
foreach
(
string
str
in
AList) { html.Append(
"
_
"
+
j
++
+
"
:/"
"
+
ds.Tables[
0
].Rows[i][str].ToString()
+
"
/",
"
); } html.Remove(html.Length
-
1
,
1
); html.Append(
"
},
1
); html.Append(
"
]
"
);
return
html.ToString(); }
#endregion
#region
分页样式 1 2 3 4 5 6 7 8 ...
///
<summary>
///
分页样式 1 2 3 4 5 6 7 8 ...
///
</summary>
///
<param name="Count"></param>
///
<returns></returns>
public
static
string
GetPager(JsonModel JM) { StringBuilder html
=
new
StringBuilder(); html.Append(
"
<div class='page_span'>
"
); html.Append(
"
<a href='javascript:Content(1)'>首页</a>
"
);
//
计算总页数
if
(JM.Count
%
JM.PageIndexCount
==
0
) JM.PageCount
=
JM.Count
/
JM.PageIndexCount;
else
JM.PageCount
=
JM.Count
/
JM.PageIndexCount
+
1
;
//
计算开始页-结束页
if
(JM.CurrentPageIndex
<=
JM.PageCount) {
if
(JM.CurrentPageIndex
/
JM.ExtPage
>=
1
&&
JM.CurrentPageIndex
<=
JM.PageCount) {
int
extPage
=
JM.CurrentPageIndex
/
JM.ExtPage; JM.StartPage
=
extPage
*
JM.ExtPage
-
1
; JM.EndPage
=
JM.StartPage
+
JM.ExtPage
+
1
; }
else
{ JM.EndPage
=
JM.StartPage
+
JM.ExtPage
+
1
; } }
if
(JM.EndPage
>
JM.PageCount) JM.EndPage
=
JM.PageCount;
if
(JM.StartPage
<
1
) JM.StartPage
=
1
;
for
(
int
i
=
JM.StartPage; i
<=
JM.EndPage; i
++
) {
if
(i
==
JM.CurrentPageIndex) { html.Append(
"
<a href='javascript:Content(
"
+
i
+
"
)'>
"
); html.Append(
"
<font color=red >
"
+
i
+
"
</font>
"
); html.Append(
"
</a>
"
); }
else
{ html.Append(
"
<a href='javascript:Content(
"
+
i
+
"
)'>
"
); html.Append(i); html.Append(
"
</a>
"
); } } html.Append(
"
<a href='javascript:Content(
"
+
JM.PageCount
+
"
)'>末页</a>
"
); html.Append(
"
</div>
"
);
return
html.ToString(); }
#endregion
#region
分页样式 上一页 下一页
///
<summary>
///
///
</summary>
///
<param name="JM">
JM.CurrentPageIndex 当前页,JM.PageCount总页
</param>
///
<returns></returns>
public
static
string
GetSmiplePager(JsonModel JM) { StringBuilder html
=
new
StringBuilder();
//
计算总页数
if
(JM.Count
%
JM.PageIndexCount
==
0
) JM.PageCount
=
JM.Count
/
JM.PageIndexCount;
else
JM.PageCount
=
JM.Count
/
JM.PageIndexCount
+
1
; html.Append(
"
<div class='page_span'>
"
); html.Append(
"
<a href='javascript:Content(1)'>首页</a>
"
);
if
(JM.CurrentPageIndex
>
1
) { html.Append(
"
<a href='javascript:Content(
"
+
(JM.CurrentPageIndex
-
1
)
+
"
)'>上一页</a>
"
); }
if
(JM.CurrentPageIndex
<
JM.PageCount) { html.Append(
"
<a href='javascript:Content(
"
+
(JM.CurrentPageIndex
+
1
)
+
"
)'>下一页</a>
"
); } html.Append(
"
<a href='javascript:Content(
"
+
JM.PageCount
+
"
)'>末页</a>
"
);
//
搜索框
html.Append(
"
<input id='t_page' style='width:30px;border:1px solid #acacac' class='btn' /> <input type='button' value='GO' onclick='if($(/"#t_page/").val()==/"/")alert(/"请输入页码/"); else if($(/"#t_page/").val()>
"
+
JM.PageCount
+
"
||$(/"#t_page/").val()==0){alert(/"请输入正确的页码!/")}else{Content($(/"#t_page/").val())}'>
"
); html.Append(
"
</div>
"
);
return
html.ToString(); }
#endregion
ashx
-
C# code
-
///
<summary>
///
///
</summary>
///
<param name="CurrentPageIndex"></param>
public
void
GetContent(
int
CurrentPageIndex) { DataSet ds
=
SqlHelper.ReturnDataSet(
"
select * from stores
"
,
5
,CurrentPageIndex,
null
); HttpContext.Current.Response.Write(JSON.GetJsonData(ds,
"
stor_id,stor_name
"
)); }
///
<summary>
///
分页样式 1 2 3 4 5 6 7 8 ...
///
</summary>
public
void
GetPager(
int
CurrentPageIndex) { JsonModel jm
=
new
JsonModel(); jm.StartPage
=
1
; jm.EndPage
=
1
; jm.PageIndexCount
=
10
; jm.ExtPage
=
10
; jm.Count
=
int
.Parse(SqlHelper.ExecuteScalar(
"
select count(*) from stores
"
).ToString()); jm.CurrentPageIndex
=
CurrentPageIndex; HttpContext.Current.Response.Write(JSON.GetPager(jm)); }
///
<summary>
///
分页样式 首页 上一页 下一页 尾页 [ ]搜索
///
</summary>
public
void
GetSmiplePager(
int
CurrentPageIndex) { JsonModel jm
=
new
JsonModel(); jm.PageIndexCount
=
10
; jm.CurrentPageIndex
=
CurrentPageIndex; jm.Count
=
int
.Parse(SqlHelper.ExecuteScalar(
"
select count(*) from stores
"
).ToString()); HttpContext.Current.Response.Write(JSON.GetSmiplePager(jm)); }
页面:
-
HTML code
-
<
form
id
="form1"
runat
="server"
>
<
script
type
="text/javascript"
language
="javascript"
>
var
PageIndex
=
1
;
//
页码
getPage(PageIndex);
function
getPage(page) { $.ajax({ type:
"
GET
"
,url:
"
handler2.ashx?page=
"
+
page
+
"
&t=2
"
,cache:
false
,success:
function
(msg) { $(
"
#pageindex
"
).html(page); $(
"
#count
"
).html(msg); } }) } Content(PageIndex);
//
第一次显示内容
//
内容
function
Content(page) {
//
$("#content").html("loadding...");
//
$("#content").ajaxSend(function(){$(this).html("Loadding...");});
if
($(
"
#pageindex
"
).html()
==
page)
return
;
//
防止重复点击同一页
$(
"
#pageindex
"
).html(page);
//
页码
$.ajax({ type:
"
GET
"
,url:
"
handler2.ashx?Page=
"
+
page
+
"
&t=0
"
,dataType:
"
json
"
,success:
function
(msg){ $(
"
#content
"
).html(
""
); $.each(msg,
function
(i){ $(
"
#content
"
).append(
"
<li class='li'>
"
); $(
"
#content
"
).append(msg[i]._0); $(
"
#content
"
).append(
"
、
"
+
msg[i]._1); $(
"
#content
"
).append(
"
</li>
"
); });
if
(page
!=
1
) $(
"
#content
"
).hide(); } }) getPage(page); $(
"
#content
"
).ajaxStop(
function
(){$(
this
).fadeIn(
500
); });
//
结束ajax
}
</
script
>
<
div
>
<
ul
id
="content"
></
ul
>
</
div
>
<
br
/>
当前页:
<
span
id
="pageindex"
></
span
>
<
br
/>
<
span
id
="count"
></
span
>
</
form
>
(编辑:李大同)
【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!
|