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 ...
随机推荐
- js进阶 11-12 jquery如何实现节点的删除和复制
js进阶 11-12 jquery如何实现节点的删除和复制 一.总结 一句话总结:remove().detach().empty()方法 1.jquery删除节点中的remove()方法和detac ...
- 【前端统计图】echarts实现单条折线图
五分钟上手: 图片.png <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...
- EM12C 安装及卸载 注意点整理
版本号: em12c 12.1.0.4 OS : redhat 5.7 x86_64bit (CentOS6.2,測试过,当时因glibc*.i686包安装一直报错.所以放弃了) ...
- oracle11g 在azure云中使用rman进行实例迁移
1,開始备份 备份脚本rman_full_backup.sh内容例如以下: #!/bin/sh export DATE=`date +%F` export BACK_DIR='/backupdisk/ ...
- C++ 快速入门笔记：进阶编程
C++入门笔记:高级编程 文件和流 打开文件 void open (const char *filename, ios::openmode mode); ios::app 追加模式.所有写入都追加到文 ...
- iOS 日志自动上报
您好,欢迎使用腾讯Bugly!腾讯Bugly是腾讯公司为移动开发者开放的服务之一. 针对移动应用,腾讯Bugly提供了专业的Crash(崩溃).Android ANR(application n ...
- erlang分布式入门（一）-ping pong
erlang分布式入门(一)-ping pong 测试环境和http://willvvv.iteye.com/blog/1523918 一样,192.168.0.182(centos-182)和192 ...
- Expression Blend 的点滴（4）--创建类似iPhone屏幕锁控件（上）
原文:Expression Blend 的点滴(4)--创建类似iPhone屏幕锁控件(上) 本篇文章,最终效果图: 当然,不只是一个UI而已,如果只是一张图片,那专业的设计师能做出更出色的效果.在 ...
- 检索06 - Oracle MySql SqlSever之间的区别和优缺点
三者之间区别 历史 1 Oracle:中文译作甲骨文,这是一家传奇的公司,有一个传奇的大老板Larry Ellision. Ellision 32岁还一事无成,读了三个大学,没得到一个学位文凭,换了十 ...
- BZOJ 2818 Gcd 线性欧拉筛（Eratosthenes银幕）
标题效果:定整N(N <= 1e7),乞讨1<=x,y<=N和Gcd(x,y)素数的数(x,y)有多少.. 思考:推,. 建立gcd(x,y) = p,然后,x / p与y / p互 ...