实现分页展示功能

基本功能:上一页、下一页、首页、尾页、跳转

两个重要的变量

1、每页显示几条数据 

2、现在是第几页   

方法
        }

        /*表格样式*/
.tab {
width: %;
background-color: blue;
text-align: center;
}
</style> </head>
<body>
<form id="form1" runat="server">
<div class="div1">奇点0216班学生信息</div> <div>
<a href="zhuce.aspx" target="_blank">添加新同学</a>
</div> <%--使用 Repeater 添加数据--%>
<asp:Repeater ID="Repeater1" runat="server"> <HeaderTemplate>
<%-- 头模板--%> <table class="tab">
<tr style="color: white; height: 30px;">
<td>编号</td>
<td>用户名</td>
<td>密码</td>
<td>昵称</td>
<td>性别</td>
<td>生日</td>
<td>年龄</td>
<td>民族</td>
<td>设置</td>
</tr>
</HeaderTemplate> <ItemTemplate>
<%-- 项模板--%> <tr style="background-color: white;">
<td><%#Eval("Ids") %></td>
<td><%#Eval("Username") %></td>
<td><%#Eval("Password") %></td>
<td><%#Eval("Nickname") %></td>
<td><%#Eval("Sexstr") %></td>
<td><%#Eval("Birthdaystr") %></td>
<td><%#Eval("Age") %></td>
<td><%#Eval("NationName") %></td>
<td>
<a href="xiugai.aspx?i=<%#Eval("Ids") %>">编辑 </a>
<a onclick="return confirm('是否要删除<%#Eval("NickName") %>?');" href="shanchu.aspx?i=<%#Eval("Ids") %>">删除</a>
</td>
</tr> </ItemTemplate> <FooterTemplate>
<%--脚模板--%>
</table>
</FooterTemplate> </asp:Repeater>
<br /><br /><br />
当前第[ <asp:Label ID="Lab1" runat="server" Text=""></asp:Label> ]页
共[ <asp:Label ID="Lab2" runat="server" Text=""></asp:Label> ]页
<asp:Button ID="but_first" runat="server" Text="首页" />
<asp:Button ID="but_up" runat="server" Text="上一页" />
<asp:Button ID="but_down" runat="server" Text="下一页" />
<asp:Button ID="but_last" runat="server" Text="尾页" /> <asp:DropDownList ID="Dr1" runat="server"></asp:DropDownList>
<asp:Button ID="but_jump" runat="server" Text="跳转" /> </form>
</body>
</html>

前台

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls; public partial class _Default : System.Web.UI.Page
{
int PageCount = ; //每页显示条数 protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
//只在第一次加载时执行的代码
//数据展示时不需要,数据展示要展示最新数据
Repeater1.DataSource = new usersData().selecttop(PageCount, );
Repeater1.DataBind(); Lab2.Text = pageAll().ToString(); //总页数 for (int i = ; i <= pageAll(); i++)
{
ListItem li = new ListItem();
li.Text = i.ToString ();
li.Value = i.ToString (); Dr1.Items.Add(li); } } but_first.Click += but_first_Click;
but_last.Click += but_last_Click;
but_up.Click += but_up_Click;
but_down.Click += but_down_Click;
but_jump.Click += but_jump_Click; } //跳转
void but_jump_Click(object sender, EventArgs e)
{
int lab =Convert .ToInt32 ( Dr1.SelectedValue); Repeater1.DataSource = new usersData().selecttop(PageCount, lab);
Repeater1.DataBind(); Lab1.Text = lab.ToString();
} //下一页
void but_down_Click(object sender, EventArgs e)
{
//获取当前页,计算下一页
int lab = Convert.ToInt32(Lab1.Text) + ; if (lab > pageAll())
{
return;
} //绑定下一页数据
Repeater1.DataSource = new usersData().selecttop(PageCount, lab);
Repeater1.DataBind(); //修改当前显示的页数
Lab1.Text = lab.ToString(); } //上一页
void but_up_Click(object sender, EventArgs e)
{
//获取当前页,计算上一页
int lab = Convert.ToInt32(Lab1.Text) - ; if (lab < )
{
return;
} //绑定下一页数据
Repeater1.DataSource = new usersData().selecttop(PageCount, lab);
Repeater1.DataBind(); //修改当前显示的页数
Lab1.Text = lab.ToString();
} //尾页
void but_last_Click(object sender, EventArgs e)
{
Repeater1.DataSource = new usersData().selecttop(PageCount, pageAll());
Repeater1.DataBind(); Lab1.Text = pageAll().ToString();
} //首页
void but_first_Click(object sender, EventArgs e)
{
Repeater1.DataSource = new usersData().selecttop(PageCount, );
Repeater1.DataBind(); Lab1.Text = "";
} //计算有多少页
public int pageAll()
{
int a = ; int All = new usersData().SelectCount(); decimal d = Convert.ToDecimal(All) / PageCount; //int 除以 int 会自动去掉小数点, a = Convert.ToInt32(Math.Ceiling(d)); //取上限 return a;
} }

后台

AutoPostBack="true"                                                 --自动提交

DropDownList1.SelectedIndexChanged------                -- 与之相对应的委托事件

效果图

WebFrom 小程序【分页功能 】的更多相关文章

  1. [转] 扩展微信小程序框架功能

    通过第三方 JavaScript 库,扩展微信小程序框架功能. 扩展微信小程序框架功能(1)——Promise ES6 对 Promise 有了原生的支持,但微信开发者工具更新版本(0.11.1122 ...

  2. SpringBoot2.0小程序支付功能实现weixin-java-pay

    SpringBoot2.0小程序支付功能实现weixin-java-pay WxJava - 微信开发 Java SDK(开发工具包); 支持包括微信支付.开放平台.公众号.企业微信/企业号.小程序等 ...

  3. 微信小程序的功能开发工具跟公众号的差别,小程序是一种减负思维对简单APP是巨大打击

    微信小程序的功能开发工具跟公众号的差别,小程序是一种减负思维对简单APP是巨大打击 摘要: 小程序和公众号最大的区别有如下四点:1.小程序没有粉丝,开发者在后台能看到的只能是累计用户访问数以及实时统计 ...

  4. 微信小程序 --- 完成小程序支付功能

    最近开发小程序,一直在看小程序的支付.经过一天的努力,小程序支付功能最终实现了. 下面感谢 csdn 博主:千堆雪惹尘埃 发布的 " 小程序与php 实现微信支付 " 原文地址: ...

  5. 微信小程序保存图片功能实现

    小程序保存图片功能实现 wxml: <view class="previewImage" style="display:{{previewImage}}" ...

  6. 微信小程序支付功能 C# .NET开发

    微信小程序支付功能的开发的时候坑比较多,不过对于钱的事谨慎也是好事.网上关于小程序支付的实例很多,但是大多多少有些问题,C#开发的更少.此篇文档的目的是讲开发过程中遇到的问题做一个备注,也方便其他开发 ...

  7. 微信小程序 - 定位功能

    (1) 查看微信小程序文档 大家可以从我截图中可以看到,API中的返回值有纬度和经度,所以我们接下来就是要用到纬度和经度逆地址解析出地址的一些信息. (2)注册腾讯地图开放平台 注册完之后选择WebS ...

  8. 微信小程序支付功能前端流程

    只是分享一下小程序支付功能的前端流程和代码, 仅供参考(使用的是uni app). handleCreate () { /** 第一步:前台将商品数据发送到后台,后台创建订单入库并返回订单id等信息 ...

  9. 微信小程序--分享功能

    微信小程序--分享功能 微信小程序前段时间开放了小程序右上角的分享功能, 可以分享任意一个页面到好友或者群聊, 但是不能分享到朋友圈 这里有微信开发文档链接:点击跳转到微信分享功能API 入口方法: ...

  10. 微信小程序——倒计时功能

    做小程序项目中,需要做一个倒计时功能,如下图: 记录一下实现步骤: 1.考虑到这个功能可能会有多处用到,所以把倒计时的函数写在utils.js里面: const formatNumber = n =& ...

随机推荐

  1. JQuery续

    一.表单属性选择器 :enabled :disabled :checked :selected <body> <form> <input type="check ...

  2. Django Template 进阶

    回顾: Variables {{ var }} {{ dict.key }} {{ var.attr }} {{ var.method }} {{ varindex }} Filter {{ list ...

  3. 消息中间件——RabbitMQ

    RabbitMQ介绍 RabbitMQ是实现AMQP(高级消息队列协议)的消息中间件的一种,最初起源于金融系统,用于在分布式系统中存储转发消息,在易用性.扩展性.高可用性等方面表现不俗.RabbitM ...

  4. Mapreduce atop Apache Phoenix (ScanPlan 初探)

    利用Mapreduce/hive查询Phoenix数据时如何划分partition? PhoenixInputFormat的源码一看便知: public List<InputSplit> ...

  5. 使用TheFolderSpy监控文件夹的变化-邮件通知

    一.概述 当我们的文档或者代码文件发布在公网.共享文件夹中,其他用户具备访问或修改的权限时,就存在文档被覆盖或删除的分享.另外一个典型的场景,发布在Web服务器上的网页文件,在网站版本不更新的时间,服 ...

  6. [UWP]不那么好用的ContentDialog

    ContentDialog是UWP开发中最常用的组件之一,一个体验良好的UWP应用很难避免不去使用它.博客园里也有许多的文章介绍如何来利用ContentDialog实现各种自定义样式的弹窗界面.不过实 ...

  7. Zhu-Takaoka Two-dimensional Pattern Matching

    Two dimensional pattern matching. Details may be added later.... Corresponding more work can be foun ...

  8. Codeforces Round #553 (Div. 2) C. Problem for Nazar 数学

    题意:从奇数列 1 3 5 7 9 ....  偶数列2 4 6 8 10...分别轮流取 1 2 4 ....2^n 个数构成新数列 求新数列的区间和 (就一次询问) 思路:首先单次区间和就是一个简 ...

  9. jdk8新特性(详解)

    最近在复习外加看点面试题,jdk8的新特性虽然在项目用用到过一两个,准备系统的了解一下jdk8的常用新特性 一:Lambd表达式 也可称为闭包         引入函数式编程到Java中 为了使现有函 ...

  10. Java 实现删除文件工具类

    工具代码 package com.wangbo; import java.io.File; /** * 删除目录或文件工具类 * @author wangbo * @date 2017-04-11 1 ...