zoukankan      html  css  js  c++  java
  • Repeater无刷新分页

    网上摘录 

    前台:
     <html xmlns="http://www.w3.org/1999/xhtml">
      <head id="Head1" runat="server">
         <title>CallBack</title>
         <script language="javascript" type="text/javascript">
             function turnPage(pageIndex) {
                 CallServer(pageIndex, 'content');

             }

             function ReceiveCallback(arg, context) {
                 var container = document.getElementById(context);
                 //alert(arg + "  " + context); //有兴趣你可以看看运行时到底显示什么东西
                 container.innerHTML = arg;
             }
         </script>
     
     </head>
     <body>
         <form id="form1" runat="server">
         <div id="content">
             <asp:Repeater ID="List" runat="server" OnItemDataBound="List_ItemDataBound">
                 <ItemTemplate>
                     <div>
                         用户名:<asp:Label ID="NickName" runat="server"></asp:Label>
                         QQ号:<asp:Label ID="QNumber" runat="server"></asp:Label>
                     </div>
                 </ItemTemplate>
             </asp:Repeater>
         </div>
         <asp:Literal ID="Pager" runat="server"></asp:Literal>
         </form>
     </body>
     </html>

    后台:
      using System;
      using System.Data;
      using System.Web;
      using System.Text;
      using System.Web.UI;
      using System.Web.UI.HtmlControls;
      using System.Web.UI.WebControls;
      using System.IO;
      using System.Globalization;

    namespace WebApplication4
    {
        public partial class _Default : System.Web.UI.Page, System.Web.UI.ICallbackEventHandler
        {
            //每页显示记录数
            static int PAGESIZE = 4;
            DataTable dt = null;
            private int currentPageIndex;
            protected void Page_Load(object sender, EventArgs e)
            {
                if (!IsPostBack)
                {
                    BindList(1, true); //绑定数据
                    //获取用于回调的
                    string callbackReference = ClientScript.GetCallbackEventReference(this, "arg", "ReceiveCallback", "content", false);
                    string callbackScript = string.Format("function CallServer(arg,content){{ {0} }}", callbackReference);
                    ClientScript.RegisterClientScriptBlock(this.GetType(), "CallServer", callbackScript, true);

                    //这3条语句你都可以不要修改直接照抄,功能是将后台的代码直接注册到前台中并执行。

                }
            }

            /**/
            /// <summary>
            /// 绑定列表
            /// </summary>
            /// <param name="pageIndex">翻页页码</param>
            /// <param name="needRender">是否需要重画分页面码</param>
            protected void BindList(int pageIndex, bool needRender)
            {
                DataTable dt = GetData();  //获取数据
                //计算总页数
                int pages = (dt.Rows.Count % PAGESIZE == 0) ? dt.Rows.Count / PAGESIZE :(dt.Rows.Count / PAGESIZE) + 1;
                if (needRender) //true 执行
                    RenderPager(pages);  //绘制出分页

                if (pageIndex > pages)//似乎没用
                    pageIndex = pages;
                else if (pageIndex < 1)
                    pageIndex = 1;

                int startId = (pageIndex - 1) * PAGESIZE + 1;  //起始页
                int endId = pageIndex * PAGESIZE;  //末尾页

                DataRow[] rows = dt.Select(string.Format("ID>={0} and ID<={1}", startId, endId));
                List.DataSource = rows;
                List.DataBind();

              //这里是数据的绑定,如果你一直按照他的思路,那你就完了,因为原作者是自己临时写的数据源,而你的数据源是在数据库中

              //所以修改代码是必须的。这里用到了分页的类PagedDataSource

             //   DataTable dt = GetData();  //获取数据
              //  //计算总页数
              //  int pages = (dt.Rows.Count % PAGESIZE == 0) ? dt.Rows.Count / PAGESIZE : (dt.Rows.Count / PAGESIZE) + 1;
             //   if (needRender)
              //  {
              //      RenderPager(pages);  //绘制出分页
              //  }
              //  PagedDataSource pds = new PagedDataSource();
              //  pds.DataSource = questionTable.DefaultView;
              //  pds.AllowPaging = true;
              //  pds.PageSize = 5;
              //  if (pageIndex == 0)
               // {
               //     pageIndex = 1;
               // }
                //设置分页对象的当前索引
               // pds.CurrentPageIndex = pageIndex - 1;   //由这个控制分页显示的数据内容
               // test.DataSource = pds;
               // test.DataBind();
            }

            /**/
            /// <summary>
            /// 画出分页页码     大家用时都可以不用修改了
            /// </summary>
            /// <param name="pages"></param>
            protected void RenderPager(int pages)
            {
                StringBuilder sb = new StringBuilder();
                int pageIndex = 1;
                do
                {
                    sb.AppendFormat("<a href='javascript:turnPage({0});'>{0}</a>&nbsp;&nbsp;",pageIndex);
                } while (pageIndex++ < pages);
                Pager.Text = sb.ToString();
            }

            /**/
            /// <summary>
           /// 初始化一个DataTable作数据源  就是获取数据并以DataTable形式返回  以便BindList调用
            /// </summary>
            protected DataTable GetData()
            {
                if (null == Cache["Data"])
                {
                    dt = new DataTable();
                    dt.Columns.Add("ID", typeof(int));
                    dt.Columns.Add("NickName", typeof(string));
                    dt.Columns.Add("QNumber", typeof(string));

                    DataRow row = dt.NewRow();
                    row["ID"] = 1;
                    row["NickName"] = "人物1";
                    row["QNumber"] = "21243468";
                    dt.Rows.Add(row);

                    row = dt.NewRow();
                    row["ID"] = 2;
                    row["NickName"] = "人物2";
                    row["QNumber"] = "9058307";
                    dt.Rows.Add(row);

                    row = dt.NewRow();
                    row["ID"] = 3;
                    row["NickName"] = "人物3";
                    row["QNumber"] = "21243468";
                    dt.Rows.Add(row);

                    row = dt.NewRow();
                    row["ID"] = 4;
                    row["NickName"] = "人物4";
                    row["QNumber"] = "22526451";
                    dt.Rows.Add(row);

                    row = dt.NewRow();
                    row["ID"] = 5;
                    row["NickName"] = "人物5";
                    row["QNumber"] = "254852182";
                    dt.Rows.Add(row);

                    row = dt.NewRow();
                    row["ID"] = 6;
                    row["NickName"] = "人物6";
                    row["QNumber"] = "81461006";
                    dt.Rows.Add(row);

                    row = dt.NewRow();
                    row["ID"] = 7;
                    row["NickName"] = "人物7";
                    row["QNumber"] = "375772376";
                    dt.Rows.Add(row);

                    row = dt.NewRow();
                    row["ID"] = 8;
                    row["NickName"] = "人物8";
                    row["QNumber"] = "153534649";
                    dt.Rows.Add(row);

                    row = dt.NewRow();
                    row["ID"] = 9;
                    row["NickName"] = "人物9";
                    row["QNumber"] = "619468";
                    dt.Rows.Add(row);

                    row = dt.NewRow();
                    row["ID"] = 10;
                    row["NickName"] = "人物10";
                    row["QNumber"] = "83223563";
                    dt.Rows.Add(row);

                    Cache["Data"] = dt;
                }
                else
                {
                    dt = Cache["Data"] as DataTable;
                }
                return dt;

               //显然原作者只是为了演示无刷新功能,才自己写数据源(从整个代码来看,可见原作者功底之深厚)

              //那么我们就得写自己的获取数据代码

              //这个就不用我写了吧,只要从数据库获取后以DataTable的形式返回即可。
            }

            #region  实现ICallbackEventHandler 成员RaiseCallbackEvent#region 实现ICallbackEventHandler 成员RaiseCallbackEvent

            //这个就是实现无刷新的回调方法了。

           //其实我们所说的无刷新分页,只是看上去不刷新,其运行时数据还是刷新的,要不然怎么让不同的页面显示不同的内容呢?

           //它是以回调的机制获取新的数据流然后再将新的数据流重新绘制显示出来

            public void RaiseCallbackEvent(string eventArgument)
            {
                currentPageIndex = Convert.ToInt32(eventArgument);
                BindList(currentPageIndex, false);
            }

            public string GetCallbackResult()
            {
                //返回再次绑定后的Repeater的表现内容
                return RenderControl(List);
            }
           #endregion

            /**/
            /// <summary>
            /// 获取指定控件重画的内容
            /// </summary>
            /// <param name="control"></param>
            /// <returns></returns>
            private string RenderControl(Control control)
            {
                StringWriter writer1 = new StringWriter(CultureInfo.InvariantCulture);
                HtmlTextWriter writer2 = new HtmlTextWriter(writer1);

                control.RenderControl(writer2);
                writer2.Flush();
                writer2.Close();
                return writer1.ToString();
            }

            //显示数据

             //显示数据这个一般自己有自己定义的显示数据形式,所以这个可以根据自己需求修改它,你设置可以不要它,自己重新来写
            protected void List_ItemDataBound(object sender, RepeaterItemEventArgs e)
            {
                if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType ==ListItemType.AlternatingItem)
                {
                    Label NickName = e.Item.FindControl("NickName") as Label;
                    Label QNumber = e.Item.FindControl("QNumber") as Label;

                    DataRow row = e.Item.DataItem as DataRow;
                    NickName.Text = row["NickName"].ToString();
                    QNumber.Text = row["QNumber"].ToString();
                }
            }
        }
    }

    乌龟才背着房子过一辈子
  • 相关阅读:
    最受欢迎的北大通选课导读·1[精品]
    社会保险,
    养老金的计算,
    毫秒 后的一个计算,
    返回格式 的数据结构再次改造,
    阶段状态池子,
    生活,-摘
    融合,
    tableview 也可以实现这个效果,
    字体大小 一致起来,
  • 原文地址:https://www.cnblogs.com/Yellowshorts/p/2792202.html
Copyright © 2011-2022 走看看