JQuery 构建客户/服务分离的链接模型中Table分页代码效率初探

　　/// <summary>

　　/// 分页功能的表格填充服务端

　　/// </summary>

　　/// <param name="FlowID"></param>

　　/// <param name="PageCount">每页数目</param>

　　/// <param name="CurrentPage">当前页</param>

　　/// <returns></returns>

　　[WebMethod]

　　[ScriptMethod(ResponseFormat = ResponseFormat.Json)]

　　public string Load_ContributivePerson_Table(string FlowID, int PageCount, int CurrentPage)

　　{

　　List<TB_WEB_NZ_INVESTMENT> list = new List<TB_WEB_NZ_INVESTMENT>();

　　list = objBusinessFacade.GetTB_WEB_NZ_INVESTMENT_CollectionByFlowID(FlowID);

　　int TotalPageCount = 0;

　　if (PageCount != 0)

　　{

　　if ((list.Count % PageCount) > 0)

　　{

　　TotalPageCount = list.Count / PageCount + 1;

　　}

　　else

　　{

　　TotalPageCount = list.Count / PageCount;

　　}

　　}//if

　　if (CurrentPage == 1)

　　{

　　//第一页

　　if (PageCount < list.Count)

　　{

　　list.RemoveRange(PageCount, list.Count - PageCount);

　　}

　　}

　　else if (CurrentPage > 1 && CurrentPage < TotalPageCount)

　　{

　　//中间页

　　int R1 = (CurrentPage - 1) * PageCount-1;

　　int R2 = CurrentPage * PageCount;

　　List<TB_WEB_NZ_INVESTMENT> list1 = new List<TB_WEB_NZ_INVESTMENT>();

　　for (int i = 0; i < list.Count; i++)

　　{

　　if (i > R1&&i<R2)

　　{

　　list1.Add(list[i]);

　　}

　　}

　　list.Clear();

　　list = list1;

　　}

　　else if (CurrentPage == TotalPageCount)

　　{

　　//尾页

　　//但返回的显示对象列表确只能是最后一页里面的记录

　　//这里需要剔除不是最后一页的元素对象

　　list.RemoveRange(0,(CurrentPage-1) * PageCount);

　　}

　　return new JavaScriptSerializer().Serialize(list);

　　}

　　List<TB_WEB_NZ_INVESTMENT> list1 = new List<TB_WEB_NZ_INVESTMENT>();

　　for (int i = 0; i < list.Count; i++)

　　{

　　if (i > R1&&i<R2)

　　{

　　list1.Add(list[i]);

　　}

　　}

　　list.Clear();

　　list = list1;

　　<table id="TData" width="100%" >

　　<thead id="thead">

　　<tr id="TR_Header" class="MyTableTR_Header" align="center" style=" height:25px">

　　<td style="width:1%; display:none" class="MyTableTD"></td>

　　<td style="width:10%" >投资人类型</td>

　　<td style="width:10%">投资人</td>

　　<td style="width:10%">出资方式</td>

　　<td style="width:10%">认缴出资额</td>

　　<td style="width:10%">实缴出资额</td>

　　<td style="width:10%">出资比例</td>

　　<td style="width:15%">余额缴付期限</td>

　　<td style="width:15%">资料是否完整</td>

　　<td style="width:10%">操作</td>

　　</tr>

　　</thead>

　　<tbody id="tbody_Data"></tbody>

　　<tfoot id="tfoot_foot">

　　<tr align="right">

　　<td style="width:100%" colspan="9">

　　<a href="#" id="First_A">首页</a>

　　<a href="#" id="Prev_A">上一页</a>

　　<a href="#" id="Next_A">下一页</a>

　　<a href="#" id="Last_A">尾页</a>

　　跳到<input id="ToPageNo" type="text" style="width:20px; height:10px; font-size:9px"/>页 |

　　总页数:<span id="showTotalPage" style="color:Red"></span>页

　　</td>

　　</tr>

　　</tfoot>

　　</table>

　　//引导数据填充表格(Table)

　　function Load_TableData(FlowID,CurrentPage)

　　{

　　$.ajax({

　　type: "POST",

　　url: IPServer +"JsonService.asmx/Load_ContributivePerson_Table",

　　data:"{FlowID:'"+FlowID+"',PageCount:"+PageCount+",CurrentPage:" + CurrentPage +"}" ,

　　contentType: "application/json; charset=utf-8",

　　dataType: "json",

　　success: function(msg){

　　msg = msg.replace(new RegExp('(^|[^\\\\])\\"\\\\/Date\\((-?[0-9]+)\\)\\\\/\\"', 'g'), "$1new Date($2)");

　　var data = eval("(" + msg + ")");

　　var strTR="";

　　var RowCount = 1;

　　jQuery.each(data, function(rec) {

　　strTR += "<TR id='TR_" + RowCount + "' class='MyTableTR' align='center' >";

　　strTR += " <TD style='width:1%; display:none' id='Key_"+RowCount+"' class='MyTableTD' >" + this.INVID + "</TD>";

　　strTR += " <TD style='width:10%' class='MyTableTD' >" + this.INVTYPEName + "</TD>";

　　strTR += " <TD style='width:10%' class='MyTableTD' >" + this.INV + "</TD>";

　　strTR += " <TD style='width:10%' class='MyTableTD' >" + this.CONFORM + "</TD>";

　　strTR += " <TD style='width:10%' class='MyTableTD' >" + this.SUBCONAM + "</TD>";

　　strTR += " <TD style='width:10%' class='MyTableTD' >" + this.ACCONAM + "</TD>";

　　strTR += " <TD style='width:10%' class='MyTableTD' >" + this.CONPROP + "</TD>";

　　strTR += " <TD style='width:15%' class='MyTableTD' >" + this.BALDEPER_ShortString + "</TD>";

　　strTR += " <TD style='width:15%' class='MyTableTD' >" + this.IsDataCompleteness + "</TD>";

　　strTR += " <TD style='width:10%' class='MyTableTD' ><a id='Link_"+RowCount+"' href='#' >选择</a></TD>";

　　strTR += "</TR>";

　　RowCount++;

　　});//jQuery.each

　　$("#tbody_Data").empty();

　　$("#tbody_Data").append(strTR);

　　$("#CurrentPage").html(CurrentPage);

　　},

　　error:function(msg){

　　alert( "Error: " + msg );

　　}

　　});

　　}//function Load_TableData()

　　$("#CurrentPage").html()　　　　　　存储当前页　　（调用代码在上个函数红色处）

　　$("#TotalPageCount").html()　　　　存储总页数　　（调用代码有个专门的函数，见下面）

　　$("#First_A").click(function(){//首页 链接操作

　　Load_TableData(strFlowID,1);

　　});

　　$("#Prev_A").click(function(){//上一页 链接操作

　　var intCurrentPage = Number(c);

　　if(intCurrentPage>1)

　　{

　　Load_TableData(strFlowID,intCurrentPage-1);

　　}

　　});

　　$("#Next_A").click(function(){//下一页 链接操作

　　var intCurrentPage = Number($("#CurrentPage").html());

　　var intTotalPageCount = Number($("#TotalPageCount").html());

　　if(intCurrentPage<intTotalPageCount)

　　{

　　Load_TableData(strFlowID,intCurrentPage+1);

　　}

　　});

　　$("#Last_A").click(function(){//尾页 链接操作

　　intLastPage = Number($("#TotalPageCount").html());

　　Load_TableData(strFlowID,intLastPage);

　　});

　　//返回页数

　　function Get_TableData_TotalCount(FlowID)

　　{

　　$.ajax({

　　type: "POST",

　　url: IPServer +"JsonService.asmx/Get_ContributivePersonTable_TotalPageCount",

　　data:"{FlowID:'"+FlowID +"',PageCount:"+PageCount+"}" ,

　　contentType: "application/json; charset=utf-8",

　　dataType: "json",

　　success: function(msg){

　　var data = eval("(" + msg + ")");

　　jQuery.each(data, function(rec) {

　　$("#TotalPageCount").html(this.Info);

　　$("#showTotalPage").html(this.Info);

　　});//jQuery.each

　　},

　　error:function(msg){

　　alert( "Error: " + msg );

　　}

　　});

　　}

　　<div id="CurrentPage" ></div>

　　<div id="TotalPageCount" ></div>