当前位置：Gxlcms > asp.net > .NET实现Repeater控件+AspNetPager控件分页

.NET实现Repeater控件+AspNetPager控件分页

时间：2021-07-01 10:21:17 帮助过：21人阅读

当然首先你要把bin文件放进你的项目，并加到你的工具栏去

  1. //页头需引用的
  2. <%@ Register Assembly="AspNetPager" Namespace="Wuqi.Webdiyer" TagPrefix="webdiyer" %>
  3. 控件部分（格式已经设计好）
  4. <webdiyer:AspNetPager ID="AspNetPager1" runat="server" AlwaysShow="True" FirstPageText="<font face='Webdings'>9</font>"
  5.  LastPageText="<font face='Webdings'>:</font>" NextPageText="<font face='Webdings'>8</font>"
  6.  PrevPageText="<font face='Webdings'>7</font>" ShowCustomInfoSection="Left" InputBoxStyle="width:19px"
  7.  TextAfterInputBox="页" TextBeforeInputBox="转到第" CustomInfoHTML="共检索到<strong>%RecordCount%</strong>条记录 页次：<strong>%CurrentPageIndex%/%PageCount%</strong> 每页<strong>%PageSize%</strong>条"
  8.  HorizontalAlign="Right" Width="100%" ShowInputBox="Always" OnPageChanged="AspNetPager1_PageChanged"
  9.  PageSize="20" ShowBoxThreshold="1">
  10. </webdiyer:AspNetPager>

后台绑定的代码

  1. void databind()
  2.     {
  3.       int QYId = Convert.ToInt32(Request.Cookies["CompenyUser"].Value);//企业的Id
  4.       DataTable dt = bll.Viewlist(QYId);
  5.       this.AspNetPager1.RecordCount = dt.Rows.Count;//获取数据的总数
  6.       PagedDataSource pds = new PagedDataSource();
  7.       pds.DataSource = dt.DefaultView;//为控件绑定数据
  8.       pds.AllowPaging = true;//分页启用
  9.       pds.PageSize = AspNetPager1.PageSize;//获取每页显示的数量
  10.       pds.CurrentPageIndex = AspNetPager1.CurrentPageIndex - 1;
  11.       Repeater1.DataSource = pds;
  12.       Repeater1.DataBind();
  13.     }

分页，只需要把绑定放在AspNetPager1_PageChanged 事件里

再给大家一个实例

前台页面代码

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="TF_Product.aspx.cs" Inherits="TF_Product" %>
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4.  
  5.  
  6. <%@ Register assembly="AspNetPager" namespace="Wuqi.Webdiyer" tagprefix="webdiyer" %>
  7.  
  8. <html xmlns="http://www.w3.org/1999/xhtml">
  9. <head runat="server">
  10.   <title>通服产品</title>
  11.   <script src="jquery.js" type="text/javascript"></script>
  12.   <script type="text/javascript">
  13.   $(document).ready(function()
  14.   {
  15.     //slides the element with class "menu_body" when paragraph with class "menu_head" is clicked
  16.     $("#firstpane p.menu_head").click(function()
  17.     {
  18.       $(this).css({backgroundImage:"url(down.png)"}).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow");
  19.       $(this).siblings().css({backgroundImage:"url(left.png)"});
  20.     });
  21.   });
  22.   </script>
  23. <style type="text/css">
  24. .menu_list { width: 229px; font-size:13px; }
  25. .menu_head { padding: 8px 60px; cursor: pointer; position: relative; margin:1px; height:16px; background: #DFEDFA url(left.png) center right no-repeat; }
  26. .menu_body { display:none;}
  27. .menu_body a { display:block; color:#006699; background-color:#EFEFEF; padding-left:60px; padding-top:8px; padding-bottom:3px; text-decoration:none; }
  28. .menu_body a:hover { color: #000000; text-decoration:underline; }
  29. </style>
  30. <meta name="keywords" content="通服科技">
  31. <meta name="description" content="江西通服科技有限公司">
  32. <link href="./Index_files/style.css" type="text/css" rel="stylesheet">
  33. <script src="js/AC_RunActiveContent.js" type="text/javascript"></script>
  34. <!--焦点图-->
  35. <style type="text/css">
  36. .anpager{background:#DFEDFA none repeat scroll 0 0;border:1px solid #CCCCCC;color:#FFFFFF;padding:4px 5px 4px 5px;}
  37. .container, .container *{margin:0; padding:0;}
  38.  
  39. .container{width:886px; height:267px; overflow:hidden;position:relative;}
  40.  
  41. .slider{position:absolute;}
  42. .slider li{ list-style:none;display:inline;}
  43. .slider img{ width:886px; height:267px; display:block;}
  44.  
  45. .num{ position:absolute; right:5px; bottom:5px;}
  46. .num li{
  47.   float: left;
  48.   color: #FF7300;
  49.   text-align: center;
  50.   line-height: 16px;
  51.   width: 16px;
  52.   height: 16px;
  53.   font-family: Arial;
  54.   font-size: 12px;
  55.   cursor: pointer;
  56.   overflow: hidden;
  57.   margin: 3px 1px;
  58.   border: 1px solid #FF7300;
  59.   background-color: #fff;
  60. }
  61. .num li.on{
  62.   color: #fff;
  63.   line-height: 21px;
  64.   width: 21px;
  65.   height: 21px;
  66.   font-size: 16px;
  67.   margin: 0 1px;
  68.   border: 0;
  69.   background-color: #FF7300;
  70.   font-weight: bold;
  71. }
  72. </style>
  73. <!--焦点图-->
  74. </head>
  75. <body>
  76. <form runat="server">
  77. <!--头部-->
  78. <table width="878" height="114" border="0" align="center" cellpadding="0" cellspacing="2" bgcolor="#FFFFFF">
  79.  <tbody>
  80.  <tr>
  81.   <td height="77">
  82.    <table width="878px" border="0" cellpadding="0" cellspacing="0">
  83.     <tbody>
  84.     <tr><td width="73%" height="53" rowspan="2" align="left"><img src="./Index_files/LOGO_SY180-60.png" width="178" height="60" border="0"></td>
  85.     <td width="27%" align="right" valign="top">
  86.     【登陆】【注册】
  87.     </td>
  88.     </tr>
  89.     </tbody>
  90.    </table>
  91.   </td>
  92.  </tr>
  93.  <tr>
  94.   <td width="878" align="center" style=" border-bottom:1px solid blue;" ><div style="width:100px; float:left;"></div>
  95. <div id="nav" align="center">
  96. <a href="Default.aspx" target="_self" style="color:Black;">首页   |</a></div>
  97.  
  98. <div id="nav" align="center">
  99. <a href="TF_RecList.aspx" target="_self" style="color:Black;">新闻中心 |</a></div>
  100.  
  101. <div id="nav" align="center">
  102. <a href="TF_Product.aspx" target="_self" style="color:Black;">通服产品 |</a></div>
  103.  
  104. <div id="nav" align="center">
  105. <a href="TF_Objects.aspx" target="_self" style="color:Black;">公司业绩 |</a></div>
  106.  
  107. <div id="nav" align="center">
  108. <a href="TF_Servers.aspx" target="_self" style="color:Black;">服务中心 |</a></div>
  109.  
  110. <div id="nav" align="center">
  111. <a href="TF_Solution.aspx" target="_self" style="color:Black;">解决方案 |</a></div>
  112.  
  113. <div id="nav" align="center">
  114. <a href="AboutUs.aspx" target="_self" style="color:Black;">关于我们 |</a></div>
  115. </td>
  116.  </tr>
  117.  <tr>
  118.   <td align="center" width="878px">
  119.    <div class="container" id="idTransformView">
  120.  <ul class="slider" id="idSlider">
  121.   <li><img src="images/01.jpg"/></li>
  122.  </ul>
  123. </div>
  124.   </td>
  125.  </tr>
  126. </tbody>
  127. </table>
  128. <!--中间-->
  129. <table width="890" border="0" align="center" cellpadding="0" cellspacing="2" bgcolor="#FFFFFF">
  130.  <tbody>
  131.  <tr>
  132.  <td>
  133.   <div style="border:1px solid #DFEDFA; height:26px; padding-top:5px; padding-left:1%">
  134.   <table width="100%">
  135.   <tr>
  136.   <td>首页 > 通服产品</td>
  137.   <td> </td><td> </td>
  138.   <td align="right"><a href="Default.aspx">返回首页</a></td>
  139.   </tr>
  140.   </table>
  141.   </div>
  142.  </td>
  143.  </tr>
  144.  </tbody>
  145. </table>
  146. <table width="890" border="0" align="center" cellpadding="0" cellspacing="2" bgcolor="#FFFFFF">
  147.  <tbody>
  148.  <tr>
  149.   <td width="229" valign="top">
  150.   <div>
  151.     <img src="img/20140305165205.jpg" width="229px" />
  152.   </div>
  153.    <div id="firstpane" class="menu_list">
  154.     <!--Code for menu starts here-->
  155.     <p class="menu_head">基建产品</p>
  156.     <div class="menu_body">
  157.     <a href="TF_Product.aspx?id=45">普通基建</a><a href="TF_Product.aspx?id=46">美化基建</a>
  158.     </div>
  159.     <p class="menu_head">无源器件</p>
  160.     <div class="menu_body">
  161.      <a href="TF_Product.aspx?id=5">天线</a> <a href="TF_Product.aspx?id=14">负载</a>
  162.      <a href="TF_Product.aspx?id=11">功分器</a> <a href="TF_Product.aspx?id=17">合路器</a>
  163.      <a href="TF_Product.aspx?id=47">耦合器</a> <a href="TF_Product.aspx?id=56">双工器</a>
  164.      <a href="TF_Product.aspx?id=70">AC安装配件</a> <a href="TF_Product.aspx?id=89">屏蔽器</a>
  165.     </div>
  166.     <p class="menu_head">防雷产品</p>
  167.     <div class="menu_body">
  168.      <a href="TF_Product.aspx?id=10">避雷器</a> <a href="TF_Product.aspx?id=57">防雷箱</a>
  169.     </div>
  170.     <p class="menu_head">电源产品</p>
  171.     <div class="menu_body">
  172.      <a href="TF_Product.aspx?id=12">开关电源</a> <a href="TF_Product.aspx?id=23">USP电源</a>
  173.      <a href="TF_Product.aspx?id=61">远供电源</a> <a href="TF_Product.aspx?id=81">电源配套</a>
  174.     </div>
  175.     <p class="menu_head">IP通讯类产品</p>
  176.     <div class="menu_body">
  177.      <a href="TF_Product.aspx?id=27">IP网络产品</a> <a href="TF_Product.aspx?id=29">IP无线产品</a>
  178.      <a href="TF_Product.aspx?id=30">IP安全产品</a> <a href="TF_Product.aspx?id=31">IP存储及服务器</a>
  179.      <a href="TF_Product.aspx?id=32">IP多媒体产品</a> <a href="TF_Product.aspx?id=33">IP管理产品</a>
  180.      <a href="TF_Product.aspx?id=71">H3C产品</a> <a href="TF_Product.aspx?id=72">迈普产品</a>
  181.      <a href="TF_Product.aspx?id=73">迪普产品</a>
  182.     </div>
  183.     <p class="menu_head">工程辅材</p>
  184.     <div class="menu_body">
  185.      <a href="TF_Product.aspx?id=6">射频组件</a> <a href="TF_Product.aspx?id=7">电缆组件</a>
  186.      <a href="TF_Product.aspx?id=8">光纤组件</a> <a href="TF_Product.aspx?id=9">五类缆组件</a>
  187.      <a href="TF_Product.aspx?id=18">接地线</a> <a href="TF_Product.aspx?id=62">辅材包</a>
  188.      <a href="TF_Product.aspx?id=82">套管</a> <a href="TF_Product.aspx?id=83">紧固件</a>
  189.     </div>
  190.     <p class="menu_head">连接器</p>
  191.     <div class="menu_body">
  192.      <a href="TF_Product.aspx?id=15">射频连接器</a> <a href="TF_Product.aspx?id=16">光纤连接器</a>
  193.      <a href="TF_Product.aspx?id=63">转换头</a>
  194.     </div>
  195.     <p class="menu_head">服务类</p>
  196.     <div class="menu_body">
  197.      <a href="TF_Product.aspx?id=58">工程建设类</a> <a href="TF_Product.aspx?id=59">工程维护类</a>
  198.      <a href="TF_Product.aspx?id=60">软件类</a>
  199.     </div>
  200.     <p class="menu_head">品牌分销</p>
  201.     <div class="menu_body">
  202.      <a href="TF_Product.aspx?id=87">华为产品</a>
  203.     </div>
  204.     <p class="menu_head">配件类</p>
  205.     <div class="menu_body">
  206.      <a href="TF_Product.aspx?id=67">配件类</a> <a href="TF_Product.aspx?id=86">标准件</a>
  207.     </div>
  208.     <p class="menu_head">其他</p>
  209.     <div class="menu_body">
  210.      <a href="TF_Product.aspx?id=66">邮费差额</a> <a href="TF_Product.aspx?id=69">工程类服务费用</a>
  211.      <a href="TF_Product.aspx?id=78">折扣</a> <a href="TF_Product.aspx?id=88">设备</a>
  212.     </div>
  213.    </div>
  214.   </td>
  215.   <td width="660" valign="top">
  216.   <div style="border-bottom:1px solid #DFEDFA; padding-left:2%; margin-left:2%;">
  217.   产品类别：<asp:DropDownList ID="ddlProductType" runat="server" DataTextField="pt_name" DataValueField="pt_id">
  218.      </asp:DropDownList>
  219.     
  220.   关键字：<asp:TextBox ID="txtGJZ" runat="server"></asp:TextBox>
  221.     
  222.      <asp:Button ID="btnSel" runat="server" Text="搜索" onclick="btnSel_Click" />
  223.   </div>
  224.   <div> </div>
  225.   <div>
  226.     <asp:Repeater ID="rp" runat="server">
  227.     <ItemTemplate>
  228.      <div style="margin-left:2%; border:1px solid #DFEDFA; padding:3px; margin-top:2px; margin-bottom:3px;">
  229.      <table width="100%">
  230.      <tr height="24px">
  231.      <td rowspan="4" width="90px">
  232.        <asp:Image ID="Image1" ImageUrl="~/Product_pic/NoPic.jpg" runat="server" Width="90px" Height="90px" />
  233.      </td>
  234.      <td width="9px"> </td>
  235.      <td width="60px">产品型号：</td>
  236.      <td><span style="float:left"><%#Eval("pr_guige")%></span><span style="float:right;"><a href="#">查看详情</a></span></td>
  237.      </tr>
  238.      <tr height="24px">
  239.      <td width="9px"> </td>
  240.      <td>产品编码：</td>
  241.      <td><%#Eval("pr_bianma")%></td>
  242.      </tr>
  243.      <tr height="30px">
  244.      <td width="9px"> </td>
  245.      <td>产品描述：</td>
  246.      <td><%#Eval("pr_ms")%></td>
  247.      </tr>
  248.      <tr><td height="8px"> </td></tr>
  249.      </table>
  250.      </div>
  251.     </ItemTemplate>
  252.     </asp:Repeater>
  253.     <div style="height:22px; margin-left:2%;" align="right">
  254.     <webdiyer:AspNetPager ID="AspNetPager1" CssClass="anpager" runat="server" FirstPageText="首页" LastPageText="尾页" NextPageText="下一页" PrevPageText="上一页"
  255.         onpagechanged="AspNetPager1_PageChanged" PageSize="6" ShowMoreButtons="False" ShowPageIndexBox="Never">
  256.       </webdiyer:AspNetPager>
  257.   </div>
  258.   </div>
  259.    
  260.   </td>
  261.  </tr>
  262. </tbody>
  263. </table>
  264. <!--版权声明-->
  265. <table width="878" border="0" align="center">
  266.  <tbody>
  267.  <tr>
  268.  <td>
  269.  <img src="./Index_files/foot_02.gif" usemap="#foot" width="878">
  270.  </td>
  271.  </tr>
  272.  </tbody>
  273. </table>
  274. </form>
  275. </body>
  276. </html>

后台代码

  1. Tb_productsHelper helper = new Tb_productsHelper();
  2.     IList<Tb_productsInfo> list = helper.GetAllListBySql(product_sql);
  3.     this.AspNetPager1.RecordCount = list.Count;//绑定总数量
  4.     this.AspNetPager1.AlwaysShow = true;
  5.     //先声明一个分页类对象
  6.     PagedDataSource ps = new PagedDataSource();
  7.     ps.AllowPaging = true;
  8.     ps.PageSize = this.AspNetPager1.PageSize;
  9.     ps.CurrentPageIndex = this.AspNetPager1.CurrentPageIndex-1;
  10.     ps.DataSource = list;
  11.     this.rp.DataSource = ps;
  12.     this.rp.DataBind();

人气教程排行

本站所有资源全部来源于网络，若本站发布的内容侵害到您的隐私或者利益，请联系我们删除！