c# Ajax后台动态分页
创建WebPager类
public static class WebPager
{
public static string WebPagerAjax(string Idn, bool IsShort)
{
string html = @"
<style type=""text/css"">.pgE{color:#FF9A2A;cursor:pointer;}.pgD{color:gray;}</style>
<script type=""text/javascript"" language=""javascript"">
var pgTotal$Idn$Page$Idn$;
function pgSetPaged$Idn$(pgi) { pgTotal$Idn$Page$Idn$ = 0;
var pageIndex = 0; var totalCount =0;var pageSize = 0;
var isFirst = true; var isLast = true;
if(pgi!=null)
{
pgTotal$Idn$Page$Idn$ = pgi.TotalPage;
pageIndex = pgi.PageIndex;
if(pageIndex==0 && pgTotal$Idn$Page$Idn$>0)
{
pageIndex=1;
}
totalCount =pgi.TotalCount;
pageSize = pgi.PageSize;
isFirst = pgi.IsFirstPage;
isLast = pgi.IsLastPage;
}
$(""#pgTotal$Idn$"").html(pgTotal$Idn$Page$Idn$);
$(""#pgIndex$Idn$"").html(pageIndex);
$(""#pgTotal$Idn$Count"").html(totalCount);
//$(""#pgSize"").html(pageSize);
$(""#pgGo$Idn$Index$Idn$"").val(pageIndex);
$(""#pgFirst$Idn$"").removeClass(""pgE"");
$(""#pgPrevious$Idn$"").removeClass(""pgE"");
$(""#pgLast$Idn$"").removeClass(""pgE"");
$(""#pgNext$Idn$"").removeClass(""pgE"");
$(""#pgFirst$Idn$"").removeClass(""pgD"");
$(""#pgPrevious$Idn$"").removeClass(""pgD"");
$(""#pgLast$Idn$"").removeClass(""pgD"");
$(""#pgNext$Idn$"").removeClass(""pgD"");
var psize = pageSize;
if (isFirst) {
$(""#pgFirst$Idn$"").addClass(""pgD"");
$(""#pgPrevious$Idn$"").addClass(""pgD"");
$(""#pgFirst$Idn$"").unbind();
$(""#pgPrevious$Idn$"").unbind();
}
else {
$(""#pgFirst$Idn$"").unbind();
$(""#pgPrevious$Idn$"").unbind();
$(""#pgFirst$Idn$"").addClass(""pgE"");
$(""#pgPrevious$Idn$"").addClass(""pgE"");
$(""#pgFirst$Idn$"").bind(""click"", { pageIndex: 1, pageSize: psize }, pgChangeIndex);
var ind = pageIndex - 1;
if (ind < 1) ind = 1;
$(""#pgPrevious$Idn$"").bind(""click"", { pageIndex: ind, pageSize: psize }, pgChangeIndex);
}
if (isLast) {
$(""#pgLast$Idn$"").addClass(""pgD"");
$(""#pgNext$Idn$"").addClass(""pgD"");
$(""#pgLast$Idn$"").unbind();
$(""#pgNext$Idn$"").unbind();
}
else {
$(""#pgLast$Idn$"").unbind();
$(""#pgNext$Idn$"").unbind();
$(""#pgLast$Idn$"").addClass(""pgE"");
$(""#pgNext$Idn$"").addClass(""pgE"");
ind = pageIndex + 1;
if (ind > pgTotal$Idn$Page$Idn$) ind = pgTotal$Idn$Page$Idn$;
$(""#pgNext$Idn$"").bind(""click"", { pageIndex: ind, pageSize: psize }, pgChangeIndex);
$(""#pgLast$Idn$"").bind(""click"", { pageIndex: pgTotal$Idn$Page$Idn$, pageSize: psize }, pgChangeIndex);
}
$(""#pgGo$Idn$"").unbind(""click"");
$(""#pgGo$Idn$"").bind(""click"", { pageSize: psize }, pgGo$Idn$);
} function pgGo$Idn$(event) {
var ind = $(""#pgGo$Idn$Index$Idn$"").val();
if(ind > pgTotal$Idn$Page$Idn$) ind = pgTotal$Idn$Page$Idn$;
if(ind < 1) ind = 1;
pgLoadData$Idn$(ind, event.data.pageSize);
}
function pgChangeIndex(event) {
pgLoadData$Idn$(event.data.pageIndex, event.data.pageSize);
}</script>
<div style=""text-align:left"">"; if (IsShort)
html += @"页次:<span id=""pgIndex$Idn$""></span>/<span id=""pgTotal$Idn$""></span>
<span id=""pgFirst$Idn$"">第一页</span>
<span id=""pgPrevious$Idn$"">上页</span>
<span id=""pgNext$Idn$"">下页</span>
<span id=""pgLast$Idn$"">最后页</span>";
else
html += @"第<span id=""pgIndex$Idn$""></span>/<span id=""pgTotal$Idn$""></span>页
总<span id=""pgTotal$Idn$Count""></span>条
<span id=""pgFirst$Idn$"" class=""btn btn-secondary-outline size-MINI radius"" >第一页</span>
<span id=""pgPrevious$Idn$"" class=""btn btn-secondary-outline size-MINI radius"" >上页</span>
<span id=""pgNext$Idn$"" class=""btn btn-secondary-outline size-MINI radius"" >下页</span>
<span id=""pgLast$Idn$"" class=""btn btn-secondary-outline size-MINI radius"" >最后页</span>
跳转<input id=""pgGo$Idn$Index$Idn$"" size=""1"" maxlength=""8"" style=""width:40px;""
onkeyup=""value=value.replace(/[^\d]/g,'')"" onbeforepaste=""clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"" class=""input-text size-MINI""/>
<button id=""pgGo$Idn$"" type=""button"" class=""btn btn-secondary size-MINI radius"" >Go</button>"; html += "</div>";
//Js中 pgLoadData$Idn$ 为期望方法
return html.Replace("$Idn$", Idn);
} /// <summary>
/// 呈现分页控制器，基于Ajax JSON数据，需要前端编写 pgLoadData 方法
/// OA专用
/// </summary>
/// <remarks>
/// 使用本方法的步骤
/// 1.调用 pgSetPaged(pgi) 设置分页数据 pgi 为 PagedInfo JSON 格式
/// 2.编写 function pgLoadData(ind, size) {} JavaScript方法处理分页数据获取
/// </remarks>
/// <returns>生成html分页UI的字符串</returns>
public static string WebPagerAjax(bool IsShort)
{
string html = @"
<style type=""text/css"">.pgE{color:#FF9A2A;cursor:pointer;}.pgD{color:gray;}</style>
<script type=""text/javascript"" language=""javascript"">
var pgTotalPage;
function pgSetPaged(pgi) {
pgTotalPage = 0;
var pageIndex = 0; var totalCount =0;var pageSize = 0;
var isFirst = true; var isLast = true;
if(pgi!=null)
{
pgTotalPage = pgi.TotalPage;
pageIndex = pgi.PageIndex;
if(pageIndex==0 && pgTotalPage>0)
{
pageIndex=1;
}
totalCount =pgi.TotalCount;
pageSize = pgi.PageSize;
isFirst = pgi.IsFirstPage;
isLast = pgi.IsLastPage;
}
$(""#pgTotal"").html(pgTotalPage);
$(""#pgIndex"").html(pageIndex);
$(""#pgTotalCount"").html(totalCount);
//$(""#pgSize"").html(pageSize);
$(""#pgGoIndex"").val(pageIndex);
$(""#pgFirst"").removeClass(""pgE"");
$(""#pgPrevious"").removeClass(""pgE"");
$(""#pgLast"").removeClass(""pgE"");
$(""#pgNext"").removeClass(""pgE"");
$(""#pgFirst"").removeClass(""pgD"");
$(""#pgPrevious"").removeClass(""pgD"");
$(""#pgLast"").removeClass(""pgD"");
$(""#pgNext"").removeClass(""pgD"");
var psize = pageSize;
if (isFirst) {
$(""#pgFirst"").addClass(""pgD"");
$(""#pgPrevious"").addClass(""pgD"");
$(""#pgFirst"").unbind();
$(""#pgPrevious"").unbind();
}
else {
$(""#pgFirst"").unbind();
$(""#pgPrevious"").unbind();
$(""#pgFirst"").addClass(""pgE"");
$(""#pgPrevious"").addClass(""pgE"");
$(""#pgFirst"").bind(""click"", { pageIndex: 1, pageSize: psize }, pgChangeIndex);
var ind = pageIndex - 1;
if (ind < 1) ind = 1;
$(""#pgPrevious"").bind(""click"", { pageIndex: ind, pageSize: psize }, pgChangeIndex);
}
if (isLast) {
$(""#pgLast"").addClass(""pgD"");
$(""#pgNext"").addClass(""pgD"");
$(""#pgLast"").unbind();
$(""#pgNext"").unbind();
}
else {
$(""#pgLast"").unbind();
$(""#pgNext"").unbind();
$(""#pgLast"").addClass(""pgE"");
$(""#pgNext"").addClass(""pgE"");
ind = pageIndex + 1;
if (ind > pgTotalPage) ind = pgTotalPage;
$(""#pgNext"").bind(""click"", { pageIndex: ind, pageSize: psize }, pgChangeIndex);
$(""#pgLast"").bind(""click"", { pageIndex: pgTotalPage, pageSize: psize }, pgChangeIndex);
}
$(""#pgGo"").unbind(""click"");
$(""#pgGo"").bind(""click"", { pageSize: psize }, pgGo);
} function pgGo(event) {
var ind = $(""#pgGoIndex"").val();
if(ind > pgTotalPage) ind = pgTotalPage;
if(ind < 1) ind = 1;
pgLoadData(ind, event.data.pageSize);
}
function pgChangeIndex(event) {
pgLoadData(event.data.pageIndex, event.data.pageSize);
}</script>
<div style=""text-align:left;margin-top:2px;"">"; if (IsShort)
html += @"页次:<span id=""pgIndex""></span>/<span id=""pgTotal""></span>
<span id=""pgFirst"" class=""btn btn-secondary-outline size-MINI radius"" >第一页</span>
<span id=""pgPrevious"" class=""btn btn-secondary-outline size-MINI radius"" >上页</span>
<span id=""pgNext"" class=""btn btn-secondary-outline size-MINI radius"" >下页</span>
<span id=""pgLast"" class=""btn btn-secondary-outline size-MINI radius"" >最后页</span>";
else
html += @"第<span id=""pgIndex""></span>/<span id=""pgTotal""></span>页
总<span id=""pgTotalCount""></span>条
<span id=""pgFirst"" class=""btn btn-secondary-outline size-MINI radius"" >第一页</span>
<span id=""pgPrevious"" class=""btn btn-secondary-outline size-MINI radius"" >上页</span>
<span id=""pgNext"" class=""btn btn-secondary-outline size-MINI radius"" >下页</span>
<span id=""pgLast"" class=""btn btn-secondary-outline size-MINI radius"" >最后页</span>
跳转<input id=""pgGoIndex"" size=""1"" maxlength=""8"" style=""width:40px;""
onkeyup=""value=value.replace(/[^\d]/g,'')"" onbeforepaste=""clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"" class=""input-text size-MINI""/>
<button id=""pgGo"" type=""button"" class=""btn btn-secondary size-MINI radius"">Go</button>"; html += "</div>";
//Js中 pgLoadData 为期望方法
return html;
} /// <summary>
/// 呈现分页控制器，基于Ajax JSON数据，需要前端编写 pgLoadData 方法
/// 资产专用
/// </summary>
/// <remarks>
/// 使用本方法的步骤
/// 1.调用 pgSetPaged(pgi) 设置分页数据 pgi 为 PagedInfo JSON 格式
/// 2.编写 function pgLoadData(ind, size) {} JavaScript方法处理分页数据获取
/// </remarks>
/// <returns>生成html分页UI的字符串</returns>
public static string WebPagerAjax1(bool IsShort)
{
string html = @"
<style type=""text/css"">.pgE{color:#FF9A2A;cursor:pointer;}.pgD{color:gray;}</style>
<script type=""text/javascript"" language=""javascript"">
var pgTotalPage1;
function pgSetPaged1(pgi) { pgTotalPage1 = 0;
var pageIndex1 = 0; var totalCount1 =0;var pageSize1 = 0;
var isFirst1 = true; var isLast1 = true;
if(pgi!=null)
{
pgTotalPage1 = pgi.TotalPage;
pageIndex1 = pgi.PageIndex;
if(pageIndex1==0 && pgTotalPage1>0)
{
pageIndex1=1;
}
totalCount1 =pgi.TotalCount;
pageSize1 = pgi.PageSize;
isFirst1 = pgi.IsFirstPage;
isLast1 = pgi.IsLastPage;
}
$(""#pgTotal1"").html(pgTotalPage1);
$(""#pgIndex1"").html(pageIndex1);
$(""#pgTotalCount1"").html(totalCount1);
//$(""#pgSize"").html(pageSize);
$(""#pgGoIndex1"").val(pageIndex1);
$(""#pgFirst1"").removeClass(""pgE"");
$(""#pgPrevious1"").removeClass(""pgE"");
$(""#pgLast1"").removeClass(""pgE"");
$(""#pgNext1"").removeClass(""pgE"");
$(""#pgFirst1"").removeClass(""pgD"");
$(""#pgPrevious1"").removeClass(""pgD"");
$(""#pgLast1"").removeClass(""pgD"");
$(""#pgNext1"").removeClass(""pgD"");
var psize = pageSize1;
if (isFirst1) {
$(""#pgFirst1"").addClass(""pgD"");
$(""#pgPrevious1"").addClass(""pgD"");
$(""#pgFirst1"").unbind();
$(""#pgPrevious1"").unbind();
}
else {
$(""#pgFirst1"").unbind();
$(""#pgPrevious1"").unbind();
$(""#pgFirst1"").addClass(""pgE"");
$(""#pgPrevious1"").addClass(""pgE"");
$(""#pgFirst1"").bind(""click"", { pageIndex1: 1, pageSize1: psize }, pgChangeIndex);
var ind = pageIndex1 - 1;
if (ind < 1) ind = 1;
$(""#pgPrevious1"").bind(""click"", { pageIndex1: ind, pageSiz1e: psize }, pgChangeIndex);
}
if (isLast1) {
$(""#pgLast1"").addClass(""pgD"");
$(""#pgNext1"").addClass(""pgD"");
$(""#pgLast1"").unbind();
$(""#pgNext1"").unbind();
}
else {
$(""#pgLast1"").unbind();
$(""#pgNext1"").unbind();
$(""#pgLast1"").addClass(""pgE"");
$(""#pgNext1"").addClass(""pgE"");
ind = pageIndex1 + 1;
if (ind > pgTotalPage1) ind = pgTotalPage1;
$(""#pgNext1"").bind(""click"", { pageIndex1: ind, pageSize1: psize }, pgChangeIndex);
$(""#pgLast1"").bind(""click"", { pageIndex1: pgTotalPage1, pageSize1: psize }, pgChangeIndex);
}
$(""#pgGo1"").unbind(""click"");
$(""#pgGo1"").bind(""click"", { pageSize1: psize }, pgGo);
} function pgGo(event) {
var ind = $(""#pgGoIndex1"").val();
if(ind > pgTotalPage1) ind = pgTotalPage1;
if(ind < 1) ind = 1;
pgLoadData(ind, event.data.pageSize);
}
function pgChangeIndex(event) {
pgLoadData(event.data.pageIndex, event.data.pageSize);
}</script>
<div style=""text-align:left"">"; if (IsShort)
html += @"页次:<span id=""pgIndex1""></span>/<span id=""pgTotal1""></span>
<span id=""pgFirst1"" class=""btn btn-secondary-outline size-MINI radius"" >第一页</span>
<span id=""pgPrevious1"" class=""btn btn-secondary-outline size-MINI radius"" >上页</span>
<span id=""pgNext1"" class=""btn btn-secondary-outline size-MINI radius"" >下页</span>
<span id=""pgLast1"" class=""btn btn-secondary-outline size-MINI radius"" >最后页</span>";
else
html += @"第<span id=""pgIndex1""></span>/<span id=""pgTotal1""></span>页
总<span id=""pgTotalCount1""></span>条
<span id=""pgFirst1"" class=""btn btn-secondary-outline size-MINI radius"" >第一页</span>
<span id=""pgPrevious1"" class=""btn btn-secondary-outline size-MINI radius"" >上页</span>
<span id=""pgNext1"" class=""btn btn-secondary-outline size-MINI radius"" >下页</span>
<span id=""pgLast1"" class=""btn btn-secondary-outline size-MINI radius"" >最后页</span>
跳转<input id=""pgGoIndex1"" size=""1"" maxlength=""8"" style=""width:40px;""
onkeyup=""value=value.replace(/[^\d]/g,'')"" onbeforepaste=""clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"" class=""input-text size-MINI""/>
<button id=""pgGo1"" type=""button"" class=""btn btn-secondary size-MINI radius"" >Go</button>"; html += "</div>";
//Js中 pgLoadData 为期望方法
return html;
} public static string WebPagerAjax()
{
string html = @"
<style type=""text/css"">.pgE{color:#FF9A2A;cursor:pointer;}.pgD{color:gray;}</style>
<script type=""text/javascript"" language=""javascript"">
var pgTotalPage;
function pgSetPaged(pgi,pgid) { pgTotalPage = 0;
var pageIndex = 0; var totalCount =0;var pageSize = 0;
var isFirst = true; var isLast = true;
if(pgi!=null)
{
pgTotalPage = pgi.TotalPage;
pageIndex = pgi.PageIndex;
if(pageIndex==0 && pgTotalPage>0)
{
pageIndex=1;
}
totalCount =pgi.TotalCount;
pageSize = pgi.PageSize;
isFirst = pgi.IsFirstPage;
isLast = pgi.IsLastPage;
}
$(""#""+pgid+""pgTotal"").html(pgTotalPage);
$(""#""+pgid+""pgIndex"").html(pageIndex);
$(""#""+pgid+""pgTotalCount"").html(totalCount);
//$(""#""+pgid+""pgSize"").html(pageSize);
$(""#""+pgid+""pgGoIndex"").val(pageIndex);
$(""#""+pgid+""pgFirst"").removeClass(""pgE"");
$(""#""+pgid+""pgPrevious"").removeClass(""pgE"");
$(""#""+pgid+""pgLast"").removeClass(""pgE"");
$(""#""+pgid+""pgNext"").removeClass(""pgE"");
$(""#""+pgid+""pgFirst"").removeClass(""pgD"");
$(""#""+pgid+""pgPrevious"").removeClass(""pgD"");
$(""#""+pgid+""pgLast"").removeClass(""pgD"");
$(""#""+pgid+""pgNext"").removeClass(""pgD"");
var psize = pageSize;
var PageID=pgid;
if (isFirst) {
$(""#""+pgid+""pgFirst"").addClass(""pgD"");
$(""#""+pgid+""pgPrevious"").addClass(""pgD"");
$(""#""+pgid+""pgFirst"").unbind();
$(""#""+pgid+""pgPrevious"").unbind();
}
else {
$(""#""+pgid+""pgFirst"").unbind();
$(""#""+pgid+""pgPrevious"").unbind();
$(""#""+pgid+""pgFirst"").addClass(""pgE"");
$(""#""+pgid+""pgPrevious"").addClass(""pgE"");
$(""#""+pgid+""pgFirst"").bind(""click"", { pageIndex: 1, pageSize: psize,pgid:PageID }, pgChangeIndex);
var ind = pageIndex - 1;
if (ind < 1) ind = 1;
$(""#""+pgid+""pgPrevious"").bind(""click"", { pageIndex: ind, pageSize: psize,pgid:PageID }, pgChangeIndex);
}
if (isLast) {
$(""#""+pgid+""pgLast"").addClass(""pgD"");
$(""#""+pgid+""pgNext"").addClass(""pgD"");
$(""#""+pgid+""pgLast"").unbind();
$(""#""+pgid+""pgNext"").unbind();
}
else {
$(""#""+pgid+""pgLast"").unbind();
$(""#""+pgid+""pgNext"").unbind();
$(""#""+pgid+""pgLast"").addClass(""pgE"");
$(""#""+pgid+""pgNext"").addClass(""pgE"");
ind = pageIndex + 1;
if (ind > pgTotalPage) ind = pgTotalPage;
$(""#""+pgid+""pgNext"").bind(""click"", { pageIndex: ind, pageSize: psize,pgid:PageID }, pgChangeIndex);
$(""#""+pgid+""pgLast"").bind(""click"", { pageIndex: pgTotalPage, pageSize: psize,pgid:PageID}, pgChangeIndex);
}
$(""#""+pgid+""pgGo"").unbind(""click"");
$(""#""+pgid+""pgGo"").bind(""click"", { pageSize: psize,pgid:PageID }, pgGo);
} function pgGo(event) {
var ind = $(""#""+event.data.pgid+""pgGoIndex"").val();
if(ind > pgTotalPage) ind = pgTotalPage;
if(ind < 1) ind = 1;
pgLoadData(ind, event.data.pageSize,event.data.pgid);
}
function pgChangeIndex(event) {
pgLoadData(event.data.pageIndex, event.data.pageSize,event.data.pgid);
}</script>";
//Js中 pgLoadData 为期望方法
return html;
} public static string WebPagerhtml(bool IsShort, string PageID)
{
string html = @"<div id=" + PageID + @"_page style=""text-align:left"">"; if (IsShort)
html += @"页次:<span id=""" + PageID + @"pgIndex""></span>/<span id=""" + PageID + @"pgTotal""></span>
<span id=""" + PageID + @"pgFirst"" class=""btn btn-secondary-outline size-MINI radius"" >第一页</span>
<span id=""" + PageID + @"pgPrevious"" class=""btn btn-secondary-outline size-MINI radius"" >上页</span>
<span id=""" + PageID + @"pgNext"" class=""btn btn-secondary-outline size-MINI radius"" >下页</span>
<span id=""" + PageID + @"pgLast"" class=""btn btn-secondary-outline size-MINI radius"" >最后页</span>";
else
html += @"第<span id=""" + PageID + @"pgIndex""></span>/<span id=""" + PageID + @"pgTotal""></span>页
总<span id=""" + PageID + @"pgTotalCount""></span>条
<span id=""" + PageID + @"pgFirst"" class=""btn btn-secondary-outline size-MINI radius"" >第一页</span>
<span id=""" + PageID + @"pgPrevious"" class=""btn btn-secondary-outline size-MINI radius"" >上页</span>
<span id=""" + PageID + @"pgNext"" class=""btn btn-secondary-outline size-MINI radius"" >下页</span>
<span id=""" + PageID + @"pgLast"" class=""btn btn-secondary-outline size-MINI radius"" >最后页</span>
跳转<input id=""" + PageID + @"pgGoIndex"" size=""1"" maxlength=""8"" style=""width:40px;""
onkeyup=""value=value.replace(/[^\d]/g,'')"" onbeforepaste=""clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"" class=""input-text size-MINI""/>
<button id=""" + PageID + @"pgGo"" type=""button"" class=""btn btn-secondary size-MINI radius"" >Go</button>"; html += "</div>";
return html;
}
}
添加填充table的js代码
//填充列表
//imgPath:图片文件夹的路径
//placeHold:占位符名|TypeName|是否使用unescape，例：\{SexID\}|Model.PubEnums.EnSex|0
function funFillTableByPage(imgPath, tableId, url, jsondata, trhtml, placeHold) {
$("#" + tableId + " .listdata").remove();
$("#" + tableId).append("<tr class='listdata'><td colspan='" + String($("#" + tableId + " tr:eq(0)").find("th").length) + "'><img src='" + imgPath + "onLoad.gif' align='absMiddle' /></td></tr>");
var arrHold = placeHold.split(",");
$.ajax({
type: "post",
url: url,
dataType: "json",
async: false,
contentType: "application/json; charset=utf-8",
data: jsondata,
success: function (result, status) {
if (result != undefined && result != null) {
var ResultJson = result;
if (ResultJson.ResultFlag == undefined) {
$("#" + tableId + " .listdata").remove();
alert(unescape(ResultJson.ResultMsg));
if (ResultJson.ResultCode == 3) {
window.top.location = "/Frame/Login";
return;
}
}
else {
if (ResultJson.ResultCode == 3) {
window.top.location = "/Frame/Login";
return;
}
if (ResultJson.ResultCode == 0) {
ResultJson = eval("("+ResultJson.ResultMsg+")");
if (ResultJson.PagedInfo.PageSize != 0 && ResultJson.PagedInfo.PageIndex != 0) {
_ind = ResultJson.PagedInfo.PageIndex;
pgSetPaged(ResultJson.PagedInfo, tableId);
}
else {
pgSetPaged(null, tableId);
}
var list = ResultJson.ListData;
$("#" + tableId + " .listdata").remove();
$.each(list, function (i) {
var item = list[i];
var row = trhtml;
for (var h = 0; h < arrHold.length; h++) {
if (arrHold[h] != null && arrHold[h] != "") {
var sText = "";
var arrHoldItem = arrHold[h].split("|");
eval("sText = item." + arrHoldItem[0]);
if (arrHoldItem.length == 3) {
if (arrHoldItem[1] != null && arrHoldItem[1] != "") {
eval("sText = funGetText('" + arrHoldItem[1] + "', \"" + sText + "\");");
}
if (arrHoldItem[2] != null && arrHoldItem[2] == "1") {
eval("sText = unescape(sText);");
}
if (arrHoldItem[2] != null && arrHoldItem[2] == "2") {
if (sText != null && sText != "" && sText.indexOf("1900-01-01") == -1) {
var dt = new Date(sText.replace(/-/g, "/"));
var month = dt.getMonth() + 1;
sText = dt.getFullYear() + "-" + month + "-" + dt.getDate();
}
else {
eval("sText = \"\";");
}
}
}
eval("row = row.replace(/\{" + arrHoldItem[0] + "\}/g, sText == null ? \"\" : unescape(sText))");
}
}
$("#" + tableId).append("<tr class='listdata'>" + row + "</tr>");
});
}
}
}
$("#" + tableId + " tr:even").addClass("dgalt");
$("#" + tableId + " tr:odd").addClass("dgitem");
},
error: function (error) {
alert("调用出错：" + error.responseText);
}
});
}
Html页面JS调用
// 每页分页显示数
var _pgSizelist = 15;
// 当前分页号
var _pgIndex = 1;
// 是否正在加载数据
var IsPgLoad = false;
// 加载列表数据
function pgLoadData(pgIndex, pgSize) {
// 判断是否正在加载数据 避免重复加载
if (IsPgLoad) return;
IsPgLoad = true;
var jsondata = Getjsondata(pgIndex, pgSize);
funFillTableByPage("../../Content/Image/", "list", "/Bus/GetList", jsondata,
$("#list tr:eq(1)").html(), "ID,Name,Name,MeName,facturer,CylinderNum,CardStatus|CardStatus|0,Remarks,CylinderCode,VehicleNum,NextCheckDate||0,ScrapDate||0");
IsPgLoad = false;
}
Html页面模板
<table id="list" class="dg">
<tr>
<th style="width: 30px;">
<input type="checkbox" id="selAll" value="" onclick="javascript: funSelectAll();" />
</th>
<th style="width: 100px;">车牌号码
</th>
<th style="width: 100px;">气瓶编号
</th>
@*<th style="width: 250px;">所属公司
</th>*@
<th style="width: 80px;">气瓶型号
</th>
<th style="width: 100px;">充装介质
</th>
<th style="width: 230px;">生产厂家
</th>
<th style="width: 120px;">出厂编号
</th>
<th style="width: 80px;">下检日期
</th>
<th style="width: 80px;">报废日期
</th>
<th style="width: 80px;">发卡状态
</th>
<th>备注
</th>
</tr>
<tr style="display: none;">
<td>
<input type="checkbox" id="chk{ID}" value="{ID}" /></td>
<td><a href="javascript:ShowVehicleDetail("{Num}");">{Num}</a></td>
<td><a href="javascript:ShowDetail("{CID}");">{CCode}</a></td> <td>{MName}</td>
<td>{MeName}</td>
<td title="{Manufacturer}">{Manufacturer}</td>
<td>{CNum}</td>
<td>{NextCheckDate}</td>
<td>{ScrapDate}</td>
<td>{CardStatus}</td>
<td>{Remarks}</td>
</tr>
<tbody>
</tbody>
</table>
<div>
<span class="btnspan">
@Html.Raw(WebPager.WebPagerAjax("list", false))
</span>
</div>
c# Ajax后台动态分页的更多相关文章
- ajax获取动态列表数据后的分页问题
ajax获取动态列表数据后的分页问题 这是我在写前台网站时遇到的一个分页问题,由于数据是通过ajax的方式来请求得到的,如果引入相应的js文件来做分页,假如只是静态的填放数据到列表各项内容中(列表条数 ...
- ajax 无刷新分页
//ajax 无刷新分页1.前台要做的 滑动时 当前page+1,通过page ajax请求后台接口获取数据将数据进行拼装;2.后台要做的 做分页接口返回json数据前台判断触发请求条件: var p ...
- 关于Ajax无刷新分页技术的一些研究 c#
关于Ajax无刷新分页技术的一些研究 c# 小弟新手,求大神有更好的解决方案,指教下~ 以前做项目,用过GridView的刷新分页,也用过EasyUI的封装好的分页技术,最近在老项目的基础上加新功能, ...
- LayUI分页，LayUI动态分页，LayUI laypage分页，LayUI laypage刷新当前页
LayUI分页,LayUI动态分页,LayUI laypage分页,LayUI laypage刷新当前页 >>>>>>>>>>>> ...
- jquery动态分页
最近一直研究jquery的分页效果,刚刚弄好了一个,拿出来与大家分享.分页效果与时光网的差不多. 网址:http://www.mtime.com/movie/news/all/ 先在aspx页面放置一 ...
- python3 django动态分页引发的list切片下标越界问题
起先是扒了一个包,动态分页的,但这个包分页之前要加载全部的数据,我这东西后台是个爬虫,不一定浏览的完所以这么做有点浪费资源,于是我改造了一下. # :param obj_count: 获得 条目总数# ...
- 后台动态添加的button，如何触发button_click事件？
后台动态添加的button,需要在Page_Load或者Page_Init重新动态生成才能执行button_click public Panel GetContrlType() { Panel pan ...
- 后台动态生成GridView列和模版
考虑到很多数据源是不确定的,所以这时无法在前台设置gridview的表头,需要在后台动态指定并绑定数据. 前台代码如下: <%@ Page Title="主页" Langua ...
- DedeCMS织梦动态分页类,datalist标签使用实例
<?php require_once(dirname(__FILE__)."/include/common.inc.php");//载入基础文件 require_once(D ...
随机推荐
- [Compose] 18. Maintaining structure whilst asyncing
We take our Promise.all() analogy further by using traversable on a Map(). Then we use two traversal ...
- 忙里偷闲( ˇˍˇ )闲里偷学【C语言篇】——（9）链表
我们至少可以通过两种结构来存储数据 数组 1.需要一整块连续的存储空间,内存中可能没有 2.插入元素,删除元素效率极低. 3.查找数据快 链表 1.查找效率低 2.不需要一块连续的内存空间 3.插入删 ...
- Android图表和图形创建库：EazeGraph
EazeGraph是一个 Android 库用于创建漂亮和花哨的图表.它具有易于使用和高度可定制的特点.当前支持四种不同的图表如下: Chart types Bar Chart Stacked Bar ...
- [Grid Layout] Use auto-fill and auto-fit if the number of repeated grid tracks is not to be def
What about the situation in which we aren’t specifying the number of columns or rows to be repeated? ...
- 简单实现的Servlet文件上传，并显示
http://my.oschina.net/Barudisshu/blog/157481
- 回顾Oracle几个用到的基本语句
create table t_name(id number,name varchar2(10)); drop table t_name; select * from table_name where ...
- RPC与REST的差别
一:RPC RPC 即远程过程调用, 非常easy的概念, 像调用本地服务(方法)一样调用server的服务(方法). 通常的实现有 XML-RPC , JSON-RPC , 通信方式基本同样, 所不 ...
- 【序列操作III】线段树
题目描述 给出序列 a1,a2,…an(0≤ai≤109),有关序列的四种操作: 1. al,al+1,…,ar(1≤l≤r≤n)加上 x(-103≤x≤103) 2. al,al+1,…,ar(1≤ ...
- HDU 1789 Doing Homework again（馋）
意甲冠军 参加大ACM竞争是非常回落乔布斯 每一个工作都有截止日期 未完成必要的期限结束的期限内扣除相应的积分 求点扣除的最低数量 把全部作业按扣分大小从大到小排序 然后就贪阿 能完毕 ...
- JackSon fasterxml学习
概述 Jackson框架是基于Java平台的一套数据处理工具,被称为"最好的JavaJson解析器". Jackson框架包含了3个核心库:streaming,databind, ...