JPagination分页插件的使用（ASP.NET中使用）
前台代码
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index.aspx.cs" Inherits="JqPaginator.Index" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JPagination分页插件demo</title>
<link href="CSS/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="CSS/style.css" rel="stylesheet" />/*这是插件的的样式*/
<script src="Scripts/jquery-1.9.1.min.js" type="text/javascript"></script>/*引用jquery脚本*/
<script src="Scripts/jquery.paginate.js" type="text/javascript"></script>/*引用插件*/
<script src="Scripts/bootstrap.min.js" type="text/javascript"></script>
</head>
<body>
<h1>
JPagination分页插件demo</h1>
<table id="TB" class="table table-bordered table-striped table-hover">
<tr id="TR">
<th>
行号
</th>
<th>
SOP名字
</th>
<th>
操作人
</th>
<th>
操作时间
</th>
</tr>
</table>
<div id="paginator">
</div>
<input type="hidden" name="name" value="" id="input_getCount" />
<script type="text/javascript">
$(function () {
getData(1); //初次运行，需要把第一页的数据放到页面显示，第一次加载完脚本之后，不会自动执行插件的onChange方法，所以需要认为的加载一次数据
$("#paginator").paginate({
count: getCount(),//getCount方法可以获取到数据的总页数
start: 1,
display: 7,
border: true,
border_color: '#fff',
text_color: '#fff',
background_color: 'black',
border_hover_color: '#ccc',
text_hover_color: '#000',
background_hover_color: '#fff',
images: false,
mouse: 'press',
onChange: function (page) {
getData(page);
}
}); });
function getCount() {
var count = "";
$.ajax({
async: false,
type: "post",
url: "Handler1.ashx?action=getCount",
data: {},
success: function (result) {
count = result;
}
});
return count;
}
function getData(page_index) {
var new_content = "";
$.ajax({
type: "post",
url: "Handler1.ashx?action=getData",
data: { page: page_index },
success: function (result) {
var content = eval(result);
for (var i = 0; i < content.length; i++) {
if (new_content.length == 0) {
new_content = "<tr><td>" + content[i]["NUM"] + "</td><td>" + content[i]["SOP"] + "</td><td>" + content[i]["NAME"] + "</td><td>" + content[i]["DATE"] + "</td></tr>";
} else {
new_content = new_content + "<tr><td>" + content[i]["NUM"] + "</td><td>" + content[i]["SOP"] + "</td><td>" + content[i]["NAME"] + "</td><td>" + content[i]["DATE"] + "</td></tr>";
}
}
$("#TR").empty().append(new_content); //装载对应分页的内容
}
});
}
</script>
</body>
</html>
在 jquery.paginate.js 这个文件中有一些默认的设定，比如说，每页显示的数量、页码的数量、首页、尾页按钮显示的文字……都可以在里面进行默认设置的更改
通过一般处理程序，请求后台数据，getCount会返回数据的总页数，getData会返回详细的数据（以JSON字符串的形式返回）
下面一段是后台代码，可以忽略不看。
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data;
using System.Data.SqlClient;
using System.Text; namespace JqPaginator
{
/// <summary>
/// Handler1 的摘要说明
/// </summary>
public class Handler1 : IHttpHandler
{
private static readonly string connStr = "Data Source=VICHIN-PC;Initial Catalog=MyTest;Integrated Security=True";
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
string StrAction = context.Request.QueryString["action"];
switch (StrAction)
{
case "getCount":
getCount(context);
break;
case "getData":
getData(context);
break;
}
context.Response.End();
}
private void getData(HttpContext context)
{
string page_Str = context.Request["page"];
int page = Convert.ToInt32(page_Str);
int firstNum = page * - ;
int secondNum = page * ;
string getData_Str = @"select A.NUM,A.SOP,A.NAME,A.[DATE] from (select ROW_NUMBER() OVER(order by NO asc) as NUM,SOP,NAME,[DATE] from dbo.SMTSOP_DELETE_RECORD) as A where A.NUM between " + firstNum + " and " + secondNum + "";
DataTable getData_DT = Query(getData_Str);
if (getData_DT.Rows.Count > )
{
context.Response.Write(DataTable2Json(getData_DT));
}
}
private void getCount(HttpContext context)
{
string getCount_Str = "select COUNT(NO) as NumCount from dbo.SMTSOP_DELETE_RECORD";
DataTable Count_DT = Query(getCount_Str);
if (Count_DT.Rows.Count > )
{
int count = Convert.ToInt32(Count_DT.Rows[][].ToString());
int j = count % ;
int k = count / ;
if (j != )
context.Response.Write((k + ).ToString());
else
{
context.Response.Write(k.ToString());
}
}
}
public static string DataTable2Json(DataTable dt)
{
StringBuilder SB = new StringBuilder();
SB.Append("[");
for (int i = ; i < dt.Rows.Count; i++)
{
SB.Append("{");
for (int j = ; j < dt.Columns.Count; j++)
{
SB.Append("\"");
SB.Append(dt.Columns[j].ColumnName);
SB.Append("\":\"");
SB.Append(dt.Rows[i][j].ToString());
SB.Append("\",");
}
SB.Remove(SB.Length - , );
SB.Append("},");
}
if (dt.Rows.Count > )
{
SB.Remove(SB.Length - , );
}
SB.Append("]");
return SB.ToString();
} public bool IsReusable
{
get
{
return false;
}
}
public static DataTable Query(string sqlStr) //创建一个表集合,名字为GetData
{
SqlConnection conn = new SqlConnection(connStr);
conn.Open();
try
{
SqlCommand comm = new SqlCommand(sqlStr, conn);
SqlDataAdapter da = new SqlDataAdapter(comm);
DataTable dt = new DataTable();
da.Fill(dt);
return dt;
}
catch (Exception ex)
{
throw ex;
}
finally
{
conn.Close();
}
}
}
}
这个是效果图
JPagination分页插件的使用（ASP.NET中使用）的更多相关文章
- PageHelper分页插件的使用
大家好!今天写ssm项目实现分页的时候用到pageHelper分页插件,在使用过程中出现了一些错误,因此写篇随笔记录下整个过程 1.背景:在项目的开发的过程中,为了实现所有的功能. 2.目标:实现分页 ...
- Spring Boot系列教程八： Mybatis使用分页插件PageHelper
一.前言 上篇博客中介绍了spring boot集成mybatis的方法,基于上篇文章这里主要介绍如何使用分页插件PageHelper.在MyBatis中提供了拦截器接口,我们可以使用PageHelp ...
- Spring Boot系列教程十一： Mybatis使用分页插件PageHelper
一.前言 上篇博客中介绍了spring boot集成mybatis的方法,基于上篇文章这里主要介绍如何使用分页插件PageHelper.在MyBatis中提供了拦截器接口,我们可以使用PageHelp ...
- Asp.Net中的三种分页方式
Asp.Net中的三种分页方式 通常分页有3种方法,分别是asp.net自带的数据显示空间如GridView等自带的分页,第三方分页控件如aspnetpager,存储过程分页等. 第一种:使用Grid ...
- Spring 中PageHelper分页插件使用
1.增加pagehelper <!-- mybatis pager --> <dependency> <groupId>com.github.pagehelper& ...
- 在angular中利用分页插件进行分页
必需:angular分页js和css 当然还有angular.js 还需要bootstrap的css angular.min.js (下面我直接把插件粘贴上去了,以免有的同学还要去找.是不是很贴 ...
- ASP.NET中无刷新分页
上次介绍了我们代码写的刷新分页,这次就来说说无刷新分页. 这次我们是在上次的基础上改动了一些,我们都知道想要无刷新,就需要Ajax,在我们的ASP.NET中AJax是和一般处理程序配合着用的. 无刷新 ...
- ASP.NET中刷新分页
1,第一次全部把数据加载到内存中,然后再做分页,性能差,不推荐. 2,GridView自带分页 3,AspNetPager分页控件 这个是第三分控件需要下载,很好用 4,自己写分页 前三种就不介绍如 ...
- 项目中DataTables分页插件的使用
在项目开发的过程中,一般都会对表格进行分页处理,大多是情况下会在项目中配置好后台分页插件,提高效率,减轻浏览器的压力.但是有时会遇到有些数据不能直接通过分页插件操作数据库进行分页数据查询,那就需要用到 ...
随机推荐
- python3的base64编解码
使用python3的base64编解码实现字符串的简易加密解密 引言: 在一些项目中,接口的报文是通过base64加密传输的,所以在进行接口自动化时,需要对所传的参数进行base64编码,对拿到的响应 ...
- linux：用户和组文件解释（/etc/passwd、/etc/shadow、/etc/group、/etc/gshadow）
一.用户文件:/etc/passwd [root@pinfun6 ~]# cat /etc/passwd root:x:0:0:root:/root:/bin/bash 1 2 3 4 5 6 7 | ...
- allure 这么高大上的测试报告环境，5 分钟搞定
allure 的测试报告是老板喜欢的样子.如果能用上 allure,干嘛还选择其他的测试报告类型呢?python 的 pytest 单元测试框架有 allure 的插件,可以很方便的在 python ...
- _proto_和prototype的区别
1. _proto_和prototype prototype属性是一个静态属性, _proto_属性是一个实例属性. prototype表示类的原型对象,_proto_表示原型对象中定义的内部属性[p ...
- 破解phpStorm 2018 亲测
网上教程很多,这里我就不多赘述,我也是看其他教程试过来的. 下面分步骤介绍一下: 1.下载,我这里选用的版本是 phpStorm 2018.3 ,下载地址 https://www.newasp.net ...
- docker快速入门01——docker安装与简单应用
1.docker简介 Docker 是一个开源的应用容器引擎,Docker 可以让开发者打包他们的应用以及依赖包到一个轻量级.可移植的容器中,然后发布到任何流行的 Linux 机器上,也可以实现虚拟化 ...
- GDAL栅格矢量化
在这里主要提供直接能用的栅格矢量化代码,这个函数中路径输入为QStrng,如果是其他类型的,请直接转成const char *: bool Polygonize(const QString& ...
- Delphi 数据类型
- Docker 镜像 容器 仓库
Docker 包括三个基本概念镜像(Image)容器(Container)仓库(Repository) Docker 镜像 Docker 镜像是一个特殊的文件系统,除了提供容器运行时所需的程序.库.资 ...
- Vim安装插件支持 MarkDown 语法、实时预览等
使用 markdown-preview.vim 插件可以实时通过浏览器预览 markdown 文件 使用该插件需要 vim 支持py2/py3 安装 使用 vim-plug: 在 .vimrc 或 i ...