jQuery+存储过程实现无刷新分页(九)
涉及到得知识点:
set ANSI_NULLS ON
set QUOTED_IDENTIFIER ON
go CREATE PROCEDURE [dbo].[GetDataByPager]
(
@startIndex INT,--代表起始条数(从0开始)
@tableName VARCHAR(50),--代表分页的表名称
@pageSize INT=5,--代表每页的条数
@condition VARCHAR(1000)='1=1',--代表条件
@key VARCHAR(20)='id', --代表主键
@orderType VARCHAR(20)='desc' --代表排序方式
)AS
BEGIN
DECLARE @SQL VARCHAR(1000)
SET @SQL='select TOP ' +CONVERT(VARCHAR(20),@pagesize)+' * FROM '+@tableName
+' WHERE '+ @condition+' and '+@key+' NOT IN(SELECT TOP ' +CONVERT(VARCHAR(20),@startIndex)+' '+@key+' FROM '+@tableName+' where '+@condition+' order by '+@key+' '+@orderType+') order by '+@key+' '+@orderType
EXEC(@SQL)
END
set ANSI_NULLS ON
set QUOTED_IDENTIFIER ON
go --得到要分页的表的总记录数
CREATE PROCEDURE [dbo].[GetDataByPager_Count]
(
@tableName VARCHAR(200),
@condition VARCHAR(1000)='1=1'
)
AS
BEGIN
DECLARE @strsql VARCHAR(2000)
SET @strsql = 'select count(*) from '+@tableName+' where '+@condition
EXEC(@strsql)
END
DAL层:
public static partial class AuthorService
{
/// <summary>
/// 分页取数据
/// </summary>
/// <param name="start">起始记录数(从1开始)</param>
/// <param name="limit">每页的条数</param>
/// <param name="condition">查询条件</param>
/// <returns></returns>
public static IList<Author> GetAuthorByPager(int start, int limit, string condition)
{
//string strsql = string.Format("Exec GetDataByPager2 {0},'{1}',{2},'{3}'", start, limit, condition);
string strsql = string.Format("Exec GetDataByPager {0},'{1}',{2},'{3}'", start - 1, "Author", limit, condition); return GetAuthorsBySql(strsql);
}
/// <summary>
/// 条件查询结果集数目
/// </summary>
/// <param name="condition">条件</param>
/// <returns></returns>
public static int GetAuthorByPager_Count(string condition)
{
//string strsql = string.Format("GetDataByPager_Count '{0}'", condition);
string strsql = string.Format("GetDataByPager_Count '{0}','{1}' ", "Author", condition);
return DBHelper.GetScalar(strsql);
}
}
BLL层代码:
public static partial class AuthorManager
{
/// <summary>
/// 分页取数据
/// </summary>
/// <param name="start">起始记录数(从1开始)</param>
/// <param name="limit">每页的条数</param>
/// <param name="condition">查询条件</param>
/// <returns></returns>
public static IList<Author> GetAuthorByPager(int start, int limit, string condition)
{
return DAL.AuthorService.GetAuthorByPager(start, limit, condition);
}
/// <summary>
/// 条件查询结果集数目
/// </summary>
/// <param name="condition">条件</param>
/// <returns></returns>
public static int GetAuthorByPager_Count(string condition)
{
return DAL.AuthorService.GetAuthorByPager_Count(condition);
}
}
引用了两个常用的js 代码:
String.format = function() {
if (arguments.length == 0)
return null;
var str = arguments[0];
for (var i = 1; i < arguments.length; i++) {
var re = new RegExp('\\{' + (i - 1) + '\\}', 'gm');
str = str.replace(re, arguments[i]);
}
return str;
}
function StringBuffer()
{
this._strings_=new Array();
}
StringBuffer.prototype.append = function(str)
{
this._strings_.push(str);
}
StringBuffer.prototype.toString=function(){
return this._strings_.join("");
}
UI层得到数据:
public partial class HandleAuthorList : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (Request["startIndex"] != null && Request["limit"] != null)
{
int startIndex = int.Parse(Request["startIndex"].ToString());
int limit = int.Parse(Request["limit"].ToString());
IList<Models.Author> authors = BLL.AuthorManager.GetAuthorByPager(startIndex, limit, "1=1");
string json = JsonHelper.Serialize(authors);
Response.Write(json);
}
else if (Request["type"] != null)
{
int rowCount= BLL.AuthorManager.GetAuthorByPager_Count("1=1");
Response.Write(rowCount);
}
}
}
Ajax异步刷新:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AuthorMgr.aspx.cs" Inherits="AuthorMgr" %> <!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 id="Head1" runat="server">
<title></title> <script src="scripts/jquery-1.2.6.js" type="text/javascript"></script> <script src="scripts/jquery-1.2.6-vsdoc-cn.js" type="text/javascript"></script> <script src="scripts/string.format.js" type="text/javascript"></script> <script src="scripts/StringBuffer.js" type="text/javascript"></script>
<script type="text/javascript">
<script type="text/javascript">
var pageIndex = 1; //用于保存或设置当前页数
var startIndex = 1; //用于保存或设置记录条数
var limit = 3; //用于设置分页的条数
var rowcount = 0; //表示总记录数
var pageCount = 0; //代表总页数
var oFooter = "<tr align='left' style='color:#003399;background-color:#99CCCC;'>"+
"<td colspan='4'><table border='0'>"+
"<tr><td><a>首页</a></td><td><a>下一页</a></td><td><a>上一页</a></td><td><a>最后一页</a></td></tr>" +
"</table></td></tr>"
function AjaxPager() {
var $table = $("#GridView1");
$("a", $table).attr("href", "javascript:void(0)")
.click(function() {
$("tr>td", $table).parent().remove();
var oA = $(this).text();
if (oA == "首页") {
pageIndex = 1;
} else if (oA == "上一页") {
pageIndex = pageIndex == 1 ? 1 : pageIndex - 1;
} else if (oA == "下一页") {
pageIndex = pageIndex >= pageCount ? pageIndex : pageIndex + 1;
} else {
pageIndex = pageCount;
}
startIndex = (pageIndex - 1) * limit + 1; $.getJSON("HandleAuthorList.aspx", { startIndex: startIndex, limit: limit }, function(josnArray) {
var sb = new StringBuffer();
$.each(josnArray, function(i, item) {
var trTemplate = "<tr style='color:#003399;background-color:White;'>" +
"<td>{0}</td><td>{1}</td><td>{2}</td><td>{3}</td>" +
"</tr>";
var oTr = String.format(trTemplate, item.id, item.au_Id, item.au_Lname, item.phone);
sb.append(oTr); }) $table.append(sb.toString());
if ($("td>a", $table).length == 0) $table.append(oFooter);
var $tableFooter = $("td>table", $table);
if (pageIndex == 1)
$("tr>td:gt(1)", $tableFooter).hide();
else if (pageIndex == pageCount)
$("tr>td:lt(2)", $tableFooter).hide();
AjaxPager(); })
});
}
$(document).ready(function() {
$.get("HandleAuthorList.aspx", { type: "getcount" }, function(data) {
rowcount = parseInt(data);
if (rowcount % limit == 0)
pageCount = rowcount / limit;
else
pageCount = parseInt(rowcount / limit) + 1;
AjaxPager();
}); });
</script>
</head>
<body>
<form id="form1" runat="server">
<div> <asp:GridView ID="GridView1" runat="server" AllowPaging="True"
AutoGenerateColumns="False" BackColor="White" BorderColor="#3366CC"
BorderStyle="None" BorderWidth="1px" CellPadding="4" DataKeyNames="Id"
DataSourceID="SqlDataSource1" EmptyDataText="没有可显示的数据记录。" PageSize="3"
Width="494px" EnableViewState="False">
<PagerSettings FirstPageText="首页" LastPageText="最后一页"
Mode="NextPreviousFirstLast" NextPageText="下一页" PreviousPageText="上一页" />
<RowStyle BackColor="White" ForeColor="#003399" />
<Columns>
<asp:BoundField DataField="Id" HeaderText="Id" ReadOnly="True"
SortExpression="Id" />
<asp:BoundField DataField="Au_Id" HeaderText="Au_Id" SortExpression="Au_Id" />
<asp:BoundField DataField="Au_Lname" HeaderText="Au_Lname"
SortExpression="Au_Lname" />
<asp:BoundField DataField="Phone" HeaderText="Phone" SortExpression="Phone" />
</Columns>
<FooterStyle BackColor="#99CCCC" ForeColor="#003399" />
<PagerStyle BackColor="#99CCCC" ForeColor="#003399" HorizontalAlign="Left" />
<SelectedRowStyle BackColor="#009999" Font-Bold="True" ForeColor="#CCFF99" />
<HeaderStyle BackColor="#003399" Font-Bold="True" ForeColor="#CCCCFF" />
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:JQuerySimpleDBConnectionString1 %>"
DeleteCommand="DELETE FROM [Author] WHERE [Id] = @Id"
InsertCommand="INSERT INTO [Author] ([Au_Id], [Au_Lname], [Au_Fname], [Phone], [Addr], [City], [State], [Zip]) VALUES (@Au_Id, @Au_Lname, @Au_Fname, @Phone, @Addr, @City, @State, @Zip)"
ProviderName="<%$ ConnectionStrings:JQuerySimpleDBConnectionString1.ProviderName %>"
SelectCommand="SELECT [Id], [Au_Id], [Au_Lname], [Au_Fname], [Phone], [Addr], [City], [State], [Zip] FROM [Author] order by Id desc"
UpdateCommand="UPDATE [Author] SET [Au_Id] = @Au_Id, [Au_Lname] = @Au_Lname, [Au_Fname] = @Au_Fname, [Phone] = @Phone, [Addr] = @Addr, [City] = @City, [State] = @State, [Zip] = @Zip WHERE [Id] = @Id">
<DeleteParameters>
<asp:Parameter Name="Id" Type="Int32" />
</DeleteParameters>
<InsertParameters>
<asp:Parameter Name="Au_Id" Type="String" />
<asp:Parameter Name="Au_Lname" Type="String" />
<asp:Parameter Name="Au_Fname" Type="String" />
<asp:Parameter Name="Phone" Type="String" />
<asp:Parameter Name="Addr" Type="String" />
<asp:Parameter Name="City" Type="String" />
<asp:Parameter Name="State" Type="String" />
<asp:Parameter Name="Zip" Type="String" />
</InsertParameters>
<UpdateParameters>
<asp:Parameter Name="Au_Id" Type="String" />
<asp:Parameter Name="Au_Lname" Type="String" />
<asp:Parameter Name="Au_Fname" Type="String" />
<asp:Parameter Name="Phone" Type="String" />
<asp:Parameter Name="Addr" Type="String" />
<asp:Parameter Name="City" Type="String" />
<asp:Parameter Name="State" Type="String" />
<asp:Parameter Name="Zip" Type="String" />
<asp:Parameter Name="Id" Type="Int32" />
</UpdateParameters>
</asp:SqlDataSource> </div>
</form>
</body>
</html>
jQuery+存储过程实现无刷新分页(九)的更多相关文章
- 无刷新分页 jquery.pagination.js
无刷新分页 jquery.pagination.js 采用Jquery无刷新分页插件jquery.pagination.js实现无刷新分页效果 1.插件参数列表 http://www.dtan.so ...
- jquery ajax php+mysql 无刷新分页 详细实例
最近在接触jquery和ajax,当前项目也会用到分页,为了用户体验更好一些,就准备用无刷新分页,这个demo很适合新手学习查看,写的比较清晰,话不多说,直接上代码吧. 首先是html页面,index ...
- javascript;Jquery;获取JSON对象,无刷新分页,异步加载,异步删除,实例。
AjaxNewsList: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> < ...
- ASP.NET Ajax简单的无刷新分页
最近练习了一些AJAX无刷新分页,写得比较简单,性能不知道怎么样,求大神指点,如有更好的分页提供,欢迎交流! 发话不多说了,直接上代码! 首先从网上下了一个JS分页,感觉挺好用的 (function( ...
- asp.net练习②——Paginaton无刷新分页
aspx代码: <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server" ...
- MVC无刷新分页(即局部刷新,带搜索,页数选择,排序功能)
我查看了很多网站,大部分评论分页都是局部刷新的,可大部分电商商品展示分页都是有刷新页面的,于是我便做了一个商品展示无刷新分页的例子.接下来我就将做一个模仿淘宝已买到的宝贝功能,不过我的是无刷新分页的. ...
- thinkphp ajax 无刷新分页效果的实现
思路:先做出传统分页效果,然后重新复制一份Page.class.php类,对它进行修改,把js中的函数传到page类中,把上一页.下一页.首页.尾页.链接页中的url地址改成js控制的函数,模板页面中 ...
- asp.net MVC4 +MVCpager 无刷新分页
本人菜鸟,最近在用MVC4和MVCpager做无刷新分页时,发现点击下一页时数据不是Ajax提交的,弄了好久终于找到原因,原来还是Jquery引用的问题,现在把代码粘出来,希望能帮到刚接触的程序员,第 ...
- MVC无刷新分页
MVC无刷新分页(即局部刷新,带搜索,页数选择,排序功能) 我查看了很多网站,大部分评论分页都是局部刷新的,可大部分电商商品展示分页都是有刷新页面的,于是我便做了一个商品展示无刷新分页的例子.接下 ...
随机推荐
- java的排序类 Collections
场景:比如说有一个List<Student> 里面有许多学生 我们想让这些学生按照年龄的大小排序 我们可以用java自带的 java.util.Collections 工具类来实现 Col ...
- vue使用element Transfer 穿梭框实现ajax请求数据和自定义查询
vue使用element Transfer 穿梭框实现ajax请求数据和自定义查询 基于element Transfer http://element-cn.eleme.io/#/zh-CN/comp ...
- Java 编程下使用 Class.forName() 加载类【转】
在一些应用中,无法事先知道使用者将加载什么类,而必须让使用者指定类名称以加载类,可以使用 Class 的静态 forName() 方法实现动态加载类.下面的范例让你可以指定类名称来获得类的相关信息. ...
- xml总结(一 )
一.了解 XML(eXtensive Markup Language)可扩展标记语言. XML是被用来传输和存储数据,焦点是内容,是对html的补充. HTML是将数据进行格式化显示.xml需要自定义 ...
- centos7安装telnet
yum list |grep telnet yum install telnet.x86_64 安装后再测试
- JAVA实现具有迭代器的线性表(单链表)
一,迭代器的基本知识: 1,为什么要用迭代器?(迭代:即对每一个元素进行一次“问候”) 比如说,我们定义了一个ADT(抽象数据类型),作为ADT的一种实现,如单链表.而单链表的基本操作中,大部分需要用 ...
- Table Dragger - 简单的 JS 拖放排序表格插件
Table Dragger 是一个极简的实现拖放排序的表格插件,纯 JavaScript 库,不依赖 jQuery.用于构建操作方便的拖放排序功能,超级容易设置,有平滑的动画,支持触摸事件. 在线演示 ...
- 攻击WEP加密无线网络
1.介绍 针对客户端环境和无客户端环境下破解WEP的几类方法. 有客户端环境: 一般当前无线网络中存在活动的无线客户端环境,即有用户通过无线连接到无线AP上并正在进行上网等操作时. 无客户端环境: 1 ...
- 第5月第7天 php slim
1. <?php require 'Slim/Slim.php'; require 'DBManagement.php'; \Slim\Slim::registerAutoloader(); $ ...
- jquery 跨域请求
参考博客: http://www.cnblogs.com/freeweb/p/4908832.html 由于安全性问题, js 一般不支持跨域操作,但只要在客户端与服务器端引入相同的参数,通过jso ...