• asp.net JQuery 分页无刷新,自定义每页显示条数


    aspx页面代码:

    其中的host层用来显示加载过来的控件,我用的是Repeater

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default5.aspx.cs" EnableEventValidation="false" Inherits="Default6" %>

    注意在头部加上EnableEventValidation="false";

    后台的cs文件中加上这个方法:方法体什么都不用写//试了试vs2010里边不加 也没事,所以说加不加这个自己看情况吧

        public override void VerifyRenderingInServerForm(Control control)

        {

        }

    页面代码:

    <div id="init">

        <div id="host">

        

        </div>

        <div id="toolBar">

        <select id="EveryPageNum">

        <option>5</option>

        <option>10</option>

        <option>15</option>

        <option>20</option>

        </select>

        <img alt="" src="Images/images/separator.gif" />

        <img alt="首页" src="Images/images/first.gif" id="lbtnFirst"/>

        <img alt="上一页" src="Images/images/prev.gif" id="lbtnPrev"/>

        <img alt="" src="Images/images/separator.gif" />

        <label>当前为第</label>

        <input type="text" size="1" id="lblNum" style="text-align:center"/>

        <label>页</label>

        <img alt="" src="Images/images/separator.gif" />

        <img alt="下一页" src="Images/images/next.gif" id = "lbtnNext"/>

        <img alt="最后一页" src="Images/images/last.gif"  id="lbtnLast"/>

        <img alt="" src="Images/images/separator.gif" />

        <label id="lblCount" runat="server" visible="True"/>

        </div>

        </div>

    本页的JS以及底部工具条的样式代码:

    <style type="text/css">

        #init

        {

            background-image:Images/images/bg.gif;

        border:1px solid #DADADA;

        490px;

        }

        #toolBar

        {

        border:1px solid #DADADA;

        background-color:#d7d7d7;

        background-image:Images/images/wbg.gif;

        background-repeat:repeat;

        }

        body,div {

           font-size:13px;

           font-family:Verdana;

            }

            .pointer

            {

            cursor:pointer;

            }

    </style>

        <script src="JQuery/jquery.js" type="text/javascript"></script>

        <script language="javascript" type="text/javascript">

            var count = '<%=Session["count"] %>';//总记录数

            var str;//需要分几页

            var select;//下拉列表每页显示多少条

            var Cpage=1;//由此参数和str的比较来确定page参数的值

            var page;//需要传的参数

            $(function(){

            select = parseInt($("#EveryPageNum").val());

            //判断分多少页

            if(count%select==0){

                str=parseInt(count/select);

            }else{

                str =(parseInt(count/select))+1;

            }

            $("#lblNum").val("1");

            $("#lblCount").text("共"+str+"页,共"+count+"条数据");

            $("#lbtnPrev").attr("src","Images/images/prev_disabled.gif");

            $("#lbtnNext").addClass("pointer"); 

            $("#lbtnFirst").attr("src","Images/images/first_disabled.gif");

            $("#lbtnLast").addClass("pointer");

            //页面加载的时候默认每页5条数据

            $.ajax({

                url:"Default6.aspx?pageSize=5",

                        data:null,

                        type:"post",

                        success:function(result){

                            $("#host").html(result);

                        }

            })

            //下拉列表每页条数改变的时候

             $("#EveryPageNum").change(function(){

                    

                    $.ajax({

                        url:"Default6.aspx?pageSize="+$(this).val()+"&time="+new Date().getTime(),

                        data:null,

                        type:"post",

                        success:function(result){

                            $("#host").html(result);

                            GetPageSize();

                        }

                    })

                })

                //点击首页的click事件

            $("#lbtnFirst").click(function(){

                $.ajax({

                    url:"Default6.aspx?page=1&pageSize="+$("#EveryPageNum").val()+"&time="+new Date().getTime(),

                    data:null,

                    type:"post",

                    success:function(result){

                        $("#host").html(result);

                        Cpage=1;

                        page=1;

                        $("#lblNum").val("1");

                        $("#lbtnFirst").attr("src","Images/images/first_disabled.gif").removeClass("pointer");

                        $("#lbtnNext").attr("src","Images/images/next.gif").addClass("pointer");

                        $("#lbtnPrev").attr("src","Images/images/prev_disabled.gif").removeClass("pointer");

                        $("#lbtnLast").attr("src","Images/images/last.gif").addClass("pointer");

                    }

                })

            })

            //点击上一页的click事件

                $("#lbtnPrev").click(function(){

                if(Cpage>=2){

                page = --Cpage;

                    $.ajax({

                        url:"Default6.aspx?page="+page+"&pageSize="+$("#EveryPageNum").val()+"&time="+new Date().getTime(),

                        data:null,

                        type:"post",

                        success:function(result){

                            $("#host").html(result);

                            $("#lblNum").val(page);

                            $("#lbtnNext").attr("src","Images/images/next.gif").addClass("pointer");

                            $("#lbtnLast").attr("src","Images/images/last.gif").addClass("pointer");

                        }

                    })

                    }

                     if(page<=1)

                     {

                          $("#lbtnPrev").attr("src","Images/images/prev_disabled.gif").removeClass("pointer");

                          $("#lbtnFirst").attr("src","Images/images/first_disabled.gif").removeClass("pointer");

                     }

                })

                //点击下一页的click事件

                 $("#lbtnNext").click(function(){

                 if(Cpage<str){

                    page = ++Cpage;

                    $.ajax({

                        url:"Default6.aspx?page="+page+"&pageSize="+$("#EveryPageNum").val()+"&time="+new Date().getTime(),

                        data:null,

                        type:"post",

                        success:function(result){

                            $("#host").html(result);

                            $("#lblNum").val(page);

                            $("#lbtnPrev").attr("src","Images/images/prev.gif").addClass("pointer");

                            $("#lbtnFirst").attr("src","Images/images/first.gif").addClass("pointer");

                        }

                    })

                    }

                    if(page>=str)

                    {

                            $("#lbtnNext").attr("src","Images/images/next_disabled.gif").removeClass("pointer");

                            $("#lbtnLast").attr("src","Images/images/last_disabled.gif").removeClass("pointer");

                    }

                })

                //点击最后一页的click事件

                $("#lbtnLast").click(function(){

                    $.ajax({

                        url:"Default6.aspx?page="+str+"&pageSize="+$("#EveryPageNum").val()+"&time="+new Date().getTime(),

                        type:"post",

                        data:null,

                        success:function(result){

                            $("#host").html(result);

                            Cpage=str;

                            page=str;

                            $("#lblNum").val(str);

                            $("#lbtnFirst").attr("src","Images/images/first.gif").addClass("pointer");

                            $("#lbtnNext").attr("src","Images/images/next_disabled.gif").removeClass("pointer");

                            $("#lbtnPrev").attr("src","Images/images/prev.gif").addClass("pointer");

                            $("#lbtnLast").attr("src","Images/images/last_disabled.gif").removeClass("pointer");

                        }

                    })

                })

            })

            function GetPageSize()

            {

                select =parseInt($("#EveryPageNum").val());

                if(count%select==0){

                str=parseInt(count/select);

            }else{

                str=(parseInt(count/select))+1;

            }

                $("#lblNum").val("1");

                $("#lblCount").text("共"+str+"页,共"+count+"条数据");

                $("#lbtnPrev").attr("src","Images/images/prev_disabled.gif").removeClass("pointer");

                $("#lbtnNext").attr("src","Images/images/next.gif").addClass("pointer");

                $("#lbtnFirst").attr("src","Images/images/first_disabled.gif").removeClass("pointer");

                $("#lbtnLast").attr("src","Images/images/last.gif").addClass("pointer");

                Cpage=1;

                page=1;

            }

    )}

     

    所提交到的页面的aspx页面以及后台代码(在本例中也就是Default6.aspx):

    前台:

    <body>

        <form id="form1" runat="server">

        <div id="dr">

        <asp:Repeater ID="repeater" runat="server">

                <ItemTemplate>

                <asp:Panel ID="plEdit" runat="server">

                        <tr>

                            <td><%# DataBinder.Eval(Container.DataItem,"id") %></td>

                            <td><%# DataBinder.Eval(Container.DataItem,"username") %></td>

                            <td><%# DataBinder.Eval(Container.DataItem,"userpwd") %></td>

                            </tr>

                            </asp:Panel>

                </ItemTemplate>

            </asp:Repeater>

            </div>

        </form>

        </body>

    后台代码:

    Load事件:

    int pageNum;

        protected void Page_Load(object sender, EventArgs e)

        {

            if (!IsPostBack)

            {

                pageNum =Convert.ToInt32(Request.QueryString["pageSize"]);

                getRepeter();

            }

        }

     

    public void getRepeter()

        {

            

            Class1 c = new Class1();

            string sql = "select * from users";

            SqlCommand cmd = new SqlCommand(sql, c.Conn);

            DataSet ds = new DataSet();

            SqlDataAdapter da = new SqlDataAdapter(cmd);

            da.Fill(ds);

     

            PagedDataSource pds = new PagedDataSource();

            pds.DataSource = ds.Tables[0].DefaultView;

            pds.AllowPaging = true;

            pds.PageSize = pageNum;

            int currentpage;

            if (Request.QueryString["page"] != null && Convert.ToInt32(Request.QueryString["page"].ToString()) >= 1)

            {

                currentpage = Convert.ToInt32(Request.QueryString["page"]);

     

                pds.CurrentPageIndex = currentpage - 1;

            }

            repeater.DataSource = pds;

            repeater.DataBind();

            Response.Clear();

            StringWriter sw = new StringWriter();

            HtmlTextWriter htw = new HtmlTextWriter(sw);

            repeater.RenderControl(htw);

            Response.Write(sw.ToString());

            Response.End();

        }

  • 相关阅读:
    javaWeb学习总结(7)-会话之session技术
    javaWeb学习总结(6)- 会话之cookie技术
    javaWeb学习总结(5)- HttpServletRequest应用
    javaWeb学习总结(4)- HTML 关于head中的<meta>标签
    javaWeb学习总结(4)- HttpServletResponse
    javaWeb学习总结(3)- Servlet总结(servlet的主要接口、类)
    javaWeb学习总结(3)- Servlet基础
    java 上传3(uploadify中文api)
    java 上传2(使用java组件fileupload和uploadify)
    java 上传1(使用java组件fileupload)
  • 原文地址:https://www.cnblogs.com/zjmzone/p/2185319.html
Copyright © 2020-2023  润新知