jquery+c# 分页列表模块

aspx 工具条

    <div class="well well-small" style="margin-left:10px;width:80%;">
        
        <div id="div_NewButton" class="btn-group">
          <button id="btnNew" class="btn" type="button" ><i class="icon-file"></i>新建入库单</button>
          <button class="btn dropdown-toggle" data-toggle="dropdown" style="height:30px;">
            <span class="caret"></span>
          </button>
          <ul class="dropdown-menu">
            <li><a id="a_NewPage" href="#" target="_blank">在新窗口中新建单据</a></li>
          </ul>
        </div>

        <button id="btnSearchDiv" class="btn"  type="button" ><i class="icon-filter"></i>单据检索</button>
        <button id="btnRefresh" class="btn"  type="button" ><i class="icon-refresh"></i>刷新列表</button>
        
        <ul class="nav nav-pills" style="float:left;margin-right:10px;">
            <li class="dropdown active">
            <a class="dropdown-toggle" data-toggle="dropdown"href="#">
                <span id="span_CheckStatusTitle">显示全部单据</span>
                <input id="txtCheckStatus" type="text" value="显示全部单据" style="display:none;"/>
                <b class="caret"></b>
            </a>
            <ul id="ul1" class="dropdown-menu">
            <li >
                <a href="javascript:void(0);" οnclick="CheckStatus_Click('显示全部单据');"><i class='icon-hand-right'></i>显示全部单据</a>
            </li>
            <li class="divider"></li>
            <li >
                <a href="javascript:void(0);" οnclick="CheckStatus_Click('显示已审单据');"><i class='icon-hand-right'></i>显示已审单据</a>
            </li>
            <li class="divider"></li>
            <li >
                <a href="javascript:void(0);" οnclick="CheckStatus_Click('显示未审单据');"><i class='icon-hand-right'></i>显示未审单据</a>
            </li>
            </ul>
            </li>
        </ul>
                
        <span>
            <img id="imgAjax" src="../Images/ajax-blue-banner.gif" style="display:none;" />
        </span>

    </div>

aspx  表格与分页控制部分

    <div style="margin:0 10px;">

    <table id="listTable" class="table table-bordered table-hover table-striped" >
    <thead >
    <tr>
        <th style="width:100px;">单据编号</th>
        <th style="width:140px;">日期</th>
        <th style="width:180px;">供应商</th>
        <th style="width:140px;">仓库货位</th>
        <th style="width:140px;">备注</th>
        <th style="width:80px;">录入</th>
        <th style="width:80px;">审核</th>
    </tr>
    </thead>
        
    <tbody id="tbodyList"></tbody>

    </table>

    <div class="pagination">
        
        <ul id="ul_Page">
        <li><a id="a_Page_First" href="javaScript:void(0);"   >首页</a></li>
        <li><a id="a_Page_Up" href="javaScript:void(0);">上一页</a></li>
        <li><a id="a_Page_Down" href="javaScript:void(0);">下一页</a></li>
        <li><a id="a_Page_End" href="javaScript:void(0);">末页</a></li>

        <li><a id="a_Page_Title">...</a></li>

        </ul>

        <span>
            
        </span>

        <div style="display:none;">
            <input id="txtPageCount" type="text" value="0"/>
            <asp:TextBox ID="txtPageNum" runat="server" ></asp:TextBox>
        </div>
        
    </div>

    </div>
    

jquery 分页查询

    $("#a_Page_First").click(function () {
        LoadTable("0", "1");
    });

    $("#a_Page_End").click(function () {
        LoadTable("0", $("#txtPageCount").val());
    });

    $("#a_Page_Up").click(function () {
        var P = $("#txtPageNum").val();

        if (P == "" || P == "0" || P == "1") {
            LoadTable("0", "1");
        }
        else {
            LoadTable("0", parseInt(P) - 1);
        }
    });

    $("#a_Page_Down").click(function () {
        var P = $("#txtPageNum").val();

        if (P == "" || P == "0") {
            LoadTable("0", "1");
        }
        else {
            if (P == $("#txtPageCount").val())
                LoadTable("0", P);
            else
                LoadTable("0", parseInt(P) + 1);
        }
    });

分页 

function LoadTable(bShowPage, PageNum)
{
    $("#imgAjax").css("display", "");
    $("#div_alert").css("display", "none");

    $.ajax({
        type: "POST",
        url: "BillInList.aspx/LoadTable",
        dataType: "json",
        contentType: "application/json;charset=utf-8",
        timeout: 15000,
        data: "{" +
        "bShowPage:\"" + bShowPage + "\"," +
        "AccountCode:\"" + $("#txtAccountCode").val() + "\"," +
        "PageNum:\"" + PageNum + "\"," +
        "EditPage:\"" + $("#txtEditPage").val() + "\"," +
        "VenGuid:\"" + $("#txtVenGuid").val() + "\"," +
        "WarehouseGuid:\"" + $("#txtWarehouseGuid").val() + "\"," +
        "Date1:\"" + $("#txtDate1").val() + "\"," +
        "Date2:\"" + $("#txtDate2").val() + "\"," +
        "CheckStatus:\"" + $("#txtCheckStatus").val() + "\"" +
        "}",
        success: function (data)
        {
            var json = $.parseJSON(data.d);
            var strResult = unescape(json[0].strResult);
            var strData = unescape(json[0].strData);
            var strPageCount = unescape(json[0].strPageCount);

            if (strResult == "OK")
            {
                $("#tbodyList").html(strData);

                if (bShowPage == "0")
                {
                    $("#txtPageNum").val(PageNum);
                    $("#a_Page_Title").html("当前第" + PageNum + "页 共" + $("#txtPageCount").val() + "页 每页10条 ");
                }
                else
                {
                    $("#txtPageNum").val(PageNum);
                    $("#txtPageCount").val(strPageCount);
                    $("#a_Page_Title").html("当前第" + PageNum + "页 共" + strPageCount + "页 每页10条 ");
                }

                $("#imgAjax").css("display", "none");
            }
            else
            {
                $("#imgAjax").css("display", "none");

                $("#div_alert").attr("class", "alert alert-error");
                $("#div_alert h4").html("失败！");
                $("#div_alert label").html(strResult);
                $("#div_alert").fadeIn("slow", function ()
                {
                    $("#div_alert").delay(1200).fadeOut("slow");
                });

            }
        },
        error: function (XmlHttpRequest, textStatus, errorThrown)
        {
            $("#imgAjax").css("display", "none");

            $("#div_alert").attr("class", "alert alert-error");
            $("#div_alert h4").html("失败！");
            $("#div_alert label").html(textStatus);
            $("#div_alert").fadeIn("slow", function ()
            {
                $("#div_alert").delay(1200).fadeOut("slow");
            });

        }
    });

}

function CheckStatus_Click(CheckStatus) {
    $("#span_CheckStatusTitle").html(CheckStatus);
    $("#txtCheckStatus").val(CheckStatus);

    LoadTable(1, 1);

}

c#

    [System.Web.Services.WebMethod]
    public static String LoadTable(string bShowPage, string AccountCode,string PageNum, string EditPage, string VenGuid, string WarehouseGuid, string Date1, string Date2, string CheckStatus)
    {   
        string strData = "";
        string strPageCount = "";
        
        if (PageNum == "")
          PageNum = "1";
        
        int startIndex = (Convert.ToInt32(PageNum)-1) * 10+1;
        int endIndex = startIndex + 9;
        
        if (!ClsParameter.IsDateTime(Date1))
            Date1 = "1900-01-01";

        if (!ClsParameter.IsDateTime(Date2))
            Date2 = "3000-01-01";
        
        SqlParameter[] paras = new SqlParameter[]
        {
          new SqlParameter("@AccountCode",AccountCode),
          new SqlParameter("@VenGuid",VenGuid),
          new SqlParameter("@WarehouseGuid",WarehouseGuid),
          new SqlParameter("@Date1",Date1),
          new SqlParameter("@Date2",Date2),
          new SqlParameter("@CheckStatus",CheckStatus),
          new SqlParameter("@startIndex",startIndex),
          new SqlParameter("@endIndex",endIndex),
          new SqlParameter("@docount",1),
        };
        
        if (bShowPage == "1")
        {
            strPageCount = SqlHelper.ExecuteScalar(ClsParameter.ConnectionString, CommandType.StoredProcedure, "sp_Invoicing_Bill_In_List", paras).ToString();

          if (strPageCount == "0")
          {
            return "[{\"strResult\":\"OK\",\"strData\":\"\",\"strPageCount\":\"0\"}]";
          }
          else
          {
            strPageCount = Convert.ToString(Math.Ceiling(Convert.ToDouble(strPageCount) / (double)10)); 
          }

        }

        paras[8].Value = 0;

        using (SqlDataReader myDr = SqlHelper.ExecuteReader(ClsParameter.ConnectionString, CommandType.StoredProcedure, "sp_Invoicing_Bill_In_List", paras))
        {
            while (myDr.Read())
            {
                strData += "<tr id='tr_" + System.Convert.ToString(myDr["BillGuid"]) + "'>" +
                "<td><a href=\"" + EditPage + ".aspx?BillGuid=" + System.Convert.ToString(myDr["BillGuid"]) + "\" >" + System.Convert.ToString(myDr["BillCode"]) + "</a>  " +
                "<a target='_blank' href=\"" + EditPage + ".aspx?BillGuid=" + System.Convert.ToString(myDr["BillGuid"]) + "\" ><img src='../Images/NewPage.png'></img></a></td>" +
                "<td>" + System.Convert.ToString(myDr["BillDate"]) + "</td>" +
                "<td>" + System.Convert.ToString(myDr["VenName"]) + "</td>" +
                "<td>" + System.Convert.ToString(myDr["WarehouseName"]) + "</td>"+
                "<td>" + System.Convert.ToString(myDr["Remark_Price"]) + "</td>" +
                "<td>" + System.Convert.ToString(myDr["BillUser_Price"]) + "</td>" +
                "<td id='td_Button_" + iRow.ToString() + "'><button class='btn btn-mini btn-danger' type='button' οnclick=\"GoodsOut('" + System.Convert.ToString(myDr["GoodsGuid"]) + "','" + iRow.ToString() + "','0');\">取消缺货</button></td>"

; 
strData += "</tr>";

                
            }
            
        }
        
        strData = Microsoft.JScript.GlobalObject.escape(strData);

        return "[{\"strResult\":\"OK\",\"strData\":\"" + strData + "\",\"strPageCount\":\"" + strPageCount + "\"}]";
        
    }

sql server 存储过程

CREATE procedure sp_Invoicing_Bill_In_List 
(
@AccountCode varchar(50),
@VenGuid varchar(50),
@WarehouseGuid varchar(50),
@Date1 varchar(50),
@Date2 varchar(50),
@startIndex int,
@endIndex int,
@docount bit
)
as
set nocount on
if(@docount=1)
begin

		
		select count(*) from vw_Invoicing_Bill_In  
		where AccountCode = @AccountCode  and VenGuid like '%' + @VenGuid +'%' 
		and WarehouseGuid like '%' + @WarehouseGuid +'%'  
		and BillDate between @Date1 and @Date2 
		and CheckUser_Price !='' 


end
else
begin
declare @indextable table(id int identity(1,1),nid int)
set rowcount @endIndex
	
		insert into @indextable(nid) 
		select AutoID from vw_Invoicing_Bill_In  
		where AccountCode = @AccountCode  and VenGuid like '%' + @VenGuid +'%' 
		and WarehouseGuid like '%' + @WarehouseGuid +'%'  
		and BillDate between @Date1 and @Date2 
		and CheckUser_Price !='' 
		order by BillDate desc,BillCode desc

	select BillGuid,BillCode,BillDate,VenName,WarehouseName,
            BillUser_Amount,CheckUser_Amount,BillUser_Price,CheckUser_Price,
            Remark_Amount,Remark_Price 
	from vw_Invoicing_Bill_In O,@indextable t where O.AutoID=t.nid
	and t.id between @startIndex and @endIndex order by t.id

end
set nocount off
GO