在这个显示篇里,简单的从后台绑定数据,包括分页和刷新的功能.
源代码下载
先看看图片展示的效果:
Ext实现
Code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="gridShow.aspx.cs" Inherits="gridShow" %>
<!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 runat="server">
<title>无标题页</title>
<link rel="Stylesheet" type="text/css" href="ExtJS/resources/css/ext-all.css" />
<link rel="Stylesheet" type="text/css" href="ExtJS/resources/css/xtheme-green.css" />
<script type="text/javascript" src="ExtJS/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ExtJS/ext-all.js"></script>
<script type="text/javascript" src="ExtJS/ext-lang-zh_CN.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<script type="text/javascript">
function ready()
{
var url = "jsonGrid.aspx?Param=select";
var sm = new Ext.grid.CheckboxSelectionModel();
var cm = new Ext.grid.ColumnModel
([
sm,new Ext.grid.RowNumberer({header:"编号",width:50}),
{header:"编号",dataIndex:"ID",width:10,hidden:true},
{header:"标题",dataIndex:"TypeCName",width:100,editor:new Ext.form.TextField()},
{header:"英文名称",dataIndex:"TypeEName",width:100,editor:new Ext.form.TextField()},
{header:"状态",dataIndex:"DelFlag",width:100,renderer:function(value){if(value==false) {return "显示";} else {return "隐藏";}}},
{header:"添加日期",dataIndex:"AddDate",width:100,renderer:Ext.util.Format.dateRenderer('Y年m月d日')}
]);
cm.defaultSortable = true;
var fields =
[
{name:"ID"},
{name:"TypeCName"},
{name:"TypeEName"},
{name:"DelFlag"},
{name:"AddDate"}
];
var store = new Ext.data.Store
({
proxy:new Ext.data.HttpProxy({url:url}),
reader:new Ext.data.JsonReader({totalProperty:"totalPorperty",root:"root",fields:fields})
});
store.load({params:{start:0,limit:15}});
var pagingBar = new Ext.PagingToolbar
({
displayInfo:true,emptyMsg:"没有数据显示",displayMsg:"显示从{0}条数据到{1}条数据，共{2}条数据",
store:store,
pageSize:15
});
var grid = new Ext.grid.GridPanel
({
id:"MenuGridPanel",
renderTo:document.body,
layout:"fit",
frame:true,
border:true,
width:600,
height:450,
autoScroll:true,
store:store,
sm:sm,
cm:cm,
viewConfig:{forceFit: true},
title:'Ext2.2全新功能版系列之--显示列表',
bbar:pagingBar
});
}
</script>
<script type="text/javascript">
Ext.onReady(ready);
</script>
</div>
</form>
</body>
</html>
后台代码实现
Code
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Collections.Generic;
using Newtonsoft.Json;
public partial class jsonGrid : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
#region 分页
int pagesize = 20;
int start = 1;
string field, asc_desc;
if (string.IsNullOrEmpty(Request["sort"]))
{
field = "ID";
asc_desc = "desc";
}
else
{
field = Request["sort"];
asc_desc = Request["dir"];
}
if (!string.IsNullOrEmpty(Request["limit"]))
{
pagesize = int.Parse(Request["limit"]);
start = int.Parse(Request["start"]);
}
start = start / pagesize;
start += 1;
#endregion
string param = Request["Param"];
switch (param)
{
case "select":
Select(field, asc_desc, pagesize, start);
break;
case "search":
break;
default:
break;
}
}
void Select(string field, string asc_desc, int pagesize, int start)
{
string json = "";
try
{
DataSet ds = ExtUtil.PaginationByTableName(field, asc_desc, pagesize, start, "TypeTable");
if (ds != null && ds.Tables[0].Rows.Count > 0)
{
json = ExtUtil.GetJsonString(ds);
int count = ExtUtil.GetCountByTableName("TypeTable");
json = "{totalPorperty:" + count + ",root:" + json + "}";
}
}
catch (Exception ee)
{
string error = ee.Message;
}
Response.Write(json);
}
}
其它部分详见源代码下载文件
源代码下载
posted @ 2008-10-28 15:18
殷良胜 阅读(2866)
评论(74) 编辑 收藏 网摘
发表评论
#1楼[
楼主]2008-10-30 13:01 |
CommonUtil.PaginationByTableName(.....) 这个方法 没贴出来
这是我的首页面
代码如下：
<%@page pageEncoding="GBK" contentType="text/html; charset=GBK" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>extDemo</title>
<link rel="stylesheet" type="text/css" href="../ext-2.2/resources/css/ext-all.css" />
<script type="text/javascript" src="../ext-2.2/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../ext-2.2/ext-all.js"></script>
</head>
<body>
<script>
Ext.onReady(function(){
var cm = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(),
{header:'id',dataIndex:'id'},
{header:'name',dataIndex:'name'},
{header:'descn',dataIndex:'descn'}
]);
var data = [
['1','name1','descn1'],
['2','name2','descn2'],
['3','name3','descn3'],
['4','name4','descn4'],
['5','name5','descn5']
];
var ds = new Ext.data.Store({
// proxy: new Ext.data.MemoryProxy(date),
proxy: new Ext.data.HttpProxy({url:'login.jsp'}),
reader: new Ext.data.JsonReader({
totalProperty: 'totalProperty',
root: 'root'
}, [
{name: 'id'},
{name: 'name'},
{name: 'descn'}
])
});
// ds.load();
ds.load({params:{start:0,limit:5}});
var grid = new Ext.grid.GridPanel({
el: 'grid',
ds: ds,
cm: cm
});
grid.render();
});
</script>
<div id="grid" style="height:265px;"></div>
</body>
</html>
下面是我的后台部分代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8"%>
<%
//String start = request.getParameter("start");
//String limit = request.getParameter("limit");
try {
// int index = Integer.parseInt(start);
// int pageSize = Integer.parseInt(limit);
String json = "{totalProperty:10,root:[";
for (int i = 0; i < 5; i++) {
json += "{id:" + i + ",name:'name" + i + "',descn:'descn" + i + "'}";
if (i != 5 - 1) {
json += ",";
}
}
json += "]}";
System.out.println(json);
response.getWriter().write(json);
} catch(Exception ex) {
}
%>
为什么数据读取不了呢
#5楼[
楼主]2008-11-28 13:51 |
@zjj
:[";
for (int i = 0; i < 5; i++) {
json += "{id:" + i + ",name:'name" + i + "',descn:'descn" + i + "'}";
if (i != 5 - 1) {
json += ",";
}
//代码的可读性较差
即使自己做测试
也希望让自己看得舒服点
这行代码
就三个字段
可以放在hashtable里面，然后再循环hashtable往每个字段里面添加数据
最后再转换成json格式
#6楼[
楼主]2008-11-28 13:59 |
@zjj
void getJson()
{
IList<Hashtable> hashList = new List<Hashtable>();
Hashtable hash = new Hashtable();
for(int i=0;i<10;i++)
{
hash["ID"] = i+1;
hash[""] = "";
hash[""] = "";
hashList.Add(hash);
}
//下面这个需要引用using Newtonsoft.Json;
//Java我没有用过 你自己按照java的方式实现吧
string jsonString = JavaScriptConvert.SerializeObject(hashList);
}
#7楼[
楼主]2008-11-28 14:07 |
@zjj
你的前台页面代码是没有问题的
我已经测试过了
你的后台代码很难看懂
所以
我改了下
using Newtonsoft.Json;
public partial class Json : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
getJson();
}
void getJson()
{
IList<Hashtable> hashList = new List<Hashtable>();
Hashtable hash = new Hashtable();
for (int i = 0; i < 10; i++)
{
hash["id"] = i + 1;
hash["name"] = "name"+i;
hash["descn"] = "descn"+i;
hashList.Add(hash);
}
//下面这个需要引用using Newtonsoft.Json;
//Java我没有用过 你自己按照java的方式实现吧
string jsonData = JavaScriptConvert.SerializeObject(hashList);
string jsonString = "{totalPorperty:" + 10 + ",root:" + jsonData + "}";
Response.Write(jsonString);
}
}
#8楼[
楼主]2008-11-28 14:12 |
@zjj
另外
你需要将'login.jsp'页面的多余的html代码删除掉
可以查看下'login.jsp'页面是不是仅仅输出了你想要的数据
多余的全部删除掉
#11楼[
楼主]2008-11-28 15:11 |
@zjj
啊
你还没有解决吗
你能够把你的'login.jsp'页面源代码贴出来吗
版主萬歲.愛死版主了^_^
仔細的看了版主這篇文章.有一問題想請教下版主.
CommonUtil.PaginationByTableName(....);這個方法版主沒貼出來.
我想了下. 客戶端每次點擊上一頁或下一頁,就以版主的例子來為例.
比如我按下一頁要顯示第二頁數據,這時將請求服務器查詢數據庫顯示這一頁的數據(這里只是查詢這一頁的數據.其它頁的數據不查詢),然後再以json流發送給客戶端. 是不是客戶端每次點擊上下頁時,服務器都要從數據庫查詢一次. 還有CommonUtil.GetCountByTableName("TypeTable");這個方法是統計總共有多少行吧!---------->不知道我有沒有誤解你的意思.
現在我的想法是:
服務器第一次查詢時把表中所有數據都查詢出來,當客戶端請求要顯示哪頁數據時,服務再選擇dataset里的數據發送給客戶端.這樣服務器就不會每次去查詢一次數據了.而只發送一次json流.------>這樣是不是好點.
還有版主.能否把你這兩個方法發我瞧瞧. 我想證實一下自己的想法.
郵箱:284654899@qq.com
#13楼[
楼主]2008-12-08 23:43 |
@蝸牛
提供源代码下载喽
--
你说的是对的
那就争取把你想的尽快实现吧
为什么我把store写成JsonStore就会报错呢？如果用本地数据的话就没问题
#16楼[
楼主]2008-12-27 09:00 |
@esse
Ext.data.Store--其子类有GroupingStore,SimpleStore,JsonStore
其中：
GroupingStore：是分组存储，实现对一个可用的字段进行记录分组；
SimpleStore：实现从数组中创建数据存储的方式；
JsonStore：通过在JSON中创建数据存储的方式；
你说的是对的：我把store写成JsonStore就会虽然没有报错，但数据却显示不出来，这个问题我没有继续深入下去弄清到底是什么原因导致，如果你有时间可以尝试下。
#17楼[
楼主]2008-12-27 09:02 |
@蝸牛
老弟最近有没有把你的想法实现呢？共享下如何？
#19楼[
楼主]2008-12-28 14:15 |
@esse
好说好说
我在用gridPanel的时候为什么分页栏不显示呢？
部分代码：
var pagingBar = new Ext.PagingToolbar
({
displayInfo:true,emptyMsg:"没有数据显示",displayMsg:"显示从{0}条数据到{1}条数据，共{2}条数据",
store:store,
pageSize:15
});
//销售机会面板
showChancePanel = Ext.extend(Ext.grid.GridPanel,{
constructor:function(){
showChancePanel.superclass.constructor.call(
this,{
title:"销售机会管理",
id:"chancePanel",
closable:true,
frame:true,
border:true,
layout:"fit",
autoScroll:true,
store:store,
cm:cm,
sm:sm,
bbar:pagingBar
}
)
}
});
我将gridpanel放在一个tabPanel中的，当隐藏左边的面板的时候分页栏才显示出来
#22楼[
楼主]2008-12-29 07:49 |
@esse
把tabPanel的高度尝试调整下
#23楼[
楼主]2008-12-29 07:50 |
@esse
将autoScroll:true, 去掉，固定高度和宽度尝试下
谢谢版主，我试过了但还是不行，我所有的内容是放在一个viewport里面的，左边面板放的是树，右边放的tabpanel，在单击树的节点的时候在右边的tabpanel中添加相应gridpanel。在 gridpanel刚弹出来的时候，表格只显示了有数据的部分，空余的部分和分页栏都没有显示，但是只要调整窗体的大小或者是隐藏或显示左边的面板的以后，gridpanel就能够正常显示了！有时间的话，再帮我看看，谢谢了！
#25楼[
楼主]2008-12-29 08:55 |
@esse
把源代码发到我的邮箱，我帮你调试下，Ext的基类文件不要上传，那个文件太大
我今天抽空写一个这样的示例
万能的版主，照你说的那样，我在添加gridpanel后用tabPanel的setSize方法设置了宽度和高度以后，显示基本正常了，不过还有一点点儿小问题，因为高度固定了，如果浏览器不是最大化的时候就显示不出来分页栏，宽度都没问题，怎样让高度也随浏览器的大小变化呢？
我把放tabPanel的那个div的宽度和高度都设为100%,全屏的时候弹出gridpanel的话，高度跟左边的面板有一点点儿不一样。其他都OK了，非常感谢版主！
#30楼[
楼主]2008-12-29 11:27 |
@esse
呵呵
#31楼[
楼主]2008-12-29 11:27 |
@esse
那好
#32楼[
楼主]2008-12-29 11:28 |
@esse
万能的版主？
差点以为你在骂我
怎么可能骂你啊？我感谢你还来不及呢！那我以后就叫你殷老师吧，真的非常感谢你了。以后还会继续麻烦你哦，希望你不会嫌烦才好哦！:)
#34楼[
楼主]2008-12-30 08:31 |
@esse
宁愿叫我版主爽点
store.load({params:{start:0,limit:15}});
每次翻页的时候 start 和 limit 的值会变吗
还有每次翻页的时候是不是都会访问一次后台的页面?
#36楼[
楼主]2009-01-16 18:12 |
@lzgchris
你的理解是正确的
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
</head>
<script language="javascript">
Ext.onReady(function(){
var sm = new Ext.grid.CheckboxSelectionModel();
var cm = new Ext.grid.ColumnModel([
new Ext.grid.RowNumberer(),
sm ,
{header:'编号',dataIndex:'id'},
{header:'登录名',dataIndex:'longName'},
{header:'名称',dataIndex:'name'},
{header:'部门',dataIndex:'descn'}
]);
cm.defaultSortable = true;
var fields =
[
{name: 'id',mapping:'id'},
{name: 'name',mapping:'name'},
{name: 'longName',mapping:'longName'},
{name:'name',mapping:'name'},
{name: 'descn',mapping:'descn'}
];
var store = new Ext.data.Store
({
proxy:new Ext.data.HttpProxy({url:'igetuserlist.asp'}),
reader:new Ext.data.JsonReader({totalProperty:"totalProperty",root:"root",fields:fields})
//,remoteSort:true
});
store.load({params:{start:0,limit:15}});
var pagingBar = new Ext.PagingToolbar
({
displayInfo:true,emptyMsg:"没有数据显示",displayMsg:"显示从{0}条数据到{1}条数据，共{2}条数据",
store:store,
pageSize:15
});
var grid = new Ext.grid.GridPanel
({
id:"gridPanl",
renderTo:"grid",
layout:"fit",
frame:true,
border:true,
width:600,
height:450,
autoScroll:true,
store:store,
sm:sm,
cm:cm,
viewConfig:{forceFit: true},
title:'Ext2.2全新功能版系列之--显示列表',
bbar:pagingBar
});
});
</script>
<body>
<div id="grid"></div>
</body>
</html>
为什么我点下一页数据没变化
我直接访问 igetuserlist.asp?start=16&limit=30 数据明显是变化的
一直想不明白
翻页传的是 start和limit
那排序传的是什么参数呢 楼主帮忙下
楼主可以加下我的QQ:262483498
我初学extJS 我的进度好慢
#42楼[
楼主]2009-01-17 10:11 |
@lzgchris
排序不用传的什么参数，这是Ext的内部机制实现的，排序时并不与后台关联
#43楼[
楼主]2009-01-17 10:13 |
@lzgchris
将我的例子以及例子中所涉及到的术语的概念和意义通过其它的网站或者官网搞清楚，你就是度过初级阶段了
#44楼[
楼主]2009-01-17 11:15 |
@lzgchris
抱歉
我没有qq
你可以加我的msn吧
我没有MSN -_-!!!
不过还是要谢谢版主了
嗯
我一直都在看你的GRID 系列一边自己动手做的试试
你的GRID 系列 怎么没有查询功能方面的呢
什么时候搞个查询方面的 那就增删改查都有了
顺便问下 GRID 上面的数据能复制吗
觉得有时只能看不能复制可能比较不方便
#47楼[
楼主]2009-01-20 12:48 |
@lzgchris
完全可以
请问，怎么复制grid上的数据呢？要设置什么参数呢？
源代码中为什么界面显示不出数据？我下载了你的数据库。我跟踪断点，都没有进入后台joson获取数据？这是什么原因！等待中--------------
vs2008打开运行时提示：Microsoft JScript 运行时错误: 'Ext' 未定义
#51楼[
楼主]2009-03-20 19:58 |
--引用--------------------------------------------------
ext: vs2008打开运行时提示：Microsoft JScript 运行时错误: 'Ext' 未定义
--------------------------------------------------------
ext-base.js
在这个文件里是否有汉字呢？包括注释掉的，如果有，全部删除掉就可以了
#52楼[
楼主]2009-03-20 21:35 |
--引用--------------------------------------------------
Levi: 源代码中为什么界面显示不出数据？我下载了你的数据库。我跟踪断点，都没有进入后台joson获取数据？这是什么原因！等待中--------------
--------------------------------------------------------
请问你下载源代码了吗
你使用的是sql server 2005数据库吗
json.aspx页面仅仅保留最上一行代码了吗
你下载的是ext2.2版本吗
你添加Newtonsoft.Json.dll引用了吗
你再尝试下 可以吗？
<div id="grid">
<script language="javascript" type="text/javascript">
function ready()
{
// var url ="LoadData.ashx";
//var sm = new Ext.grid.CheckboxSelectionModel();
var cm = new Ext.grid.ColumnModel
([
//sm,new Ext.grid.RowNumberer(),
{header:"编号",dataIndex:"ID"},
{header:"系统编号",dataIndex:"CardID"},
{header:"批次号",dataIndex:"BatchNo"},
{header:"卡号",dataIndex:"CardNumber"},
{header:"密码",dataIndex:"CardPassword"},
{header:"状态",dataIndex:"state",width:100},
{header:"有效日期",dataIndex:"EndDate"}
])
cm.defaultSortable = true;
var fields=
[
{name:"ID"},
{name:"CardID"},
{name:"BatchNo"},
{name:"CardNumber"},
{name:"CardPassword"},
{name:"state"},
{name:"EndDate"}
];
var json =
{
"records":
[
{"ID":"1","CardID":"1","BatchNo":"652007798798","CardNumber":"1111111111111","CardPassword":"121212121212","state":"1","EndDate":"2008-09-12"},
{"ID":"2","CardID":"2","BatchNo":"652007798798","CardNumber":"1111111111111","CardPassword":"121212121212","state":"1","EndDate":"2008-09-12"},
{"ID":"3","CardID":"3","BatchNo":"652007798798","CardNumber":"1111111111111","CardPassword":"121212121212","state":"1","EndDate":"2008-09-12"},
{"ID":"4","CardID":"4","BatchNo":"652007798798","CardNumber":"1111111111111","CardPassword":"121212121212","state":"1","EndDate":"2008-09-12"},
{"ID":"5","CardID":"5","BatchNo":"652007798798","CardNumber":"1111111111111","CardPassword":"121212121212","state":"1","EndDate":"2008-09-12"}
]
}
var ds = Ext.data.Store
({
proxy:new Ext.data.MemoryProxy(json),
reader:new Ext.data.JsonReader({root:"root",fields:fields})
});
ds.load()
var grid = Ext.grid.GripPanel
({
id:"grid",
layout:"fit",
frame:true,
border:true,
width:600,
height:450,
autoScroll:true,
ds:ds,
cm:cm
});
grid.render();
}
</script>
<script type="text/javascript">
Ext.onReady(ready);
</script>
</div>
我的这段代码怎么显示不了啊，我都搞了一天了，帮看一下
lz 我也下你的Demo,并作些改动，我用的是2000的数据库下的pubs，所以改了下你的函数 PaginationByTableName 我用的是存储过程进行分页，数据是得到了，但是我在前台显示不出来，ff的post能得到
---------------------------
{totalPorperty:23,root:[{"au_lname":"White","au_id":"172-32-1176","au_fname":"Johnson","phone":"408 496-7223"
},{"au_lname":"Green","au_id":"213-46-8915","au_fname":"Marjorie","phone":"415 986-7020"},{"au_lname"
:"Carson","au_id":"238-95-7766","au_fname":"Cheryl","phone":"415 548-7723"},{"au_lname":"O'Leary","au_id"
:"267-41-2394","au_fname":"Michael","phone":"408 286-2428"},{"au_lname":"Straight","au_id":"274-80-9391"
,"au_fname":"Dean","phone":"415 834-2919"},{"au_lname":"Smith","au_id":"341-22-1782","au_fname":"Meander"
,"phone":"913 843-0462"},{"au_lname":"Bennet","au_id":"409-56-7008","au_fname":"Abraham","phone":"415
658-9932"},{"au_lname":"Dull","au_id":"427-17-2319","au_fname":"Ann","phone":"415 836-7128"},{"au_lname"
:"Gringlesby","au_id":"472-27-2349","au_fname":"Burt","phone":"707 938-6445"},{"au_lname":"Locksley"
,"au_id":"486-29-1786","au_fname":"Charlene","phone":"415 585-4620"},{"au_lname":"Greene","au_id":"527-72-3246"
,"au_fname":"Morningstar","phone":"615 297-2723"},{"au_lname":"Blotchet-Halls","au_id":"648-92-1872"
,"au_fname":"Reginald","phone":"503 745-6402"},{"au_lname":"Yokomoto","au_id":"672-71-3249","au_fname"
:"Akiko","phone":"415 935-4228"},{"au_lname":"del Castillo","au_id":"712-45-1867","au_fname":"Innes"
,"phone":"615 996-8275"},{"au_lname":"DeFrance","au_id":"722-51-5454","au_fname":"Michel","phone":"219
547-9982"}]}
----------------------------------------
但是一直抱 this.ds is undefined ext-all.js(第144行)
[Break on this error] Ext.grid.GridView=function(A){Ext.apply(...Offset:function(){this.setDelta(0,0)}});
郁闷了半天了。
下面我贴出我用的存储过程
-------------------------------
SET QUOTED_IDENTIFIER OFF
GO
SET ANSI_NULLS OFF
GO
/*********************************************************
* 作 用：数据分页(完整SQL分页存储过程（支持多表联接）)
* 作 者：齐李平
* 创建日期：2009-03-23
* 使用说明：
1、单表调用方法：EXEC proc_DataPagination @tblName = 'ipa',@fldName = '*',@pageSize =50,@page = 6789,@fldSort = '',@Sort = 1,@strCondition = '',@ID = 'id',@Dist = 0,@pageCount = null,@Counts = NULL
2、多表调用方法：EXEC proc_DataPagination @tblName = 'Info LEFT JOIN InfoType it ON it.typeid=Info.tid',@fldName = 'info.*,it.tname',@pageSize =50,@page = 1806,@fldSort = '',@Sort = 0,@strCondition = '',@ID = 'id',@Dist = 0, @pageCount = null,@Counts = NULL
* 多表联合查询使用需注意：1、多表中的主键字段不能为相同的名称。2、多表中不能允许具有相同名称的字段，如果存在相同名称的字段你可以使用AS重命名
*********************************************************/
ALTER PROCEDURE [dbo].[proc_DataPagination]
(
@tblName nvarchar(200), ----要显示的表或多个表的连接
@fldName nvarchar(500) = '*', ----要显示的字段列表
@pageSize int = 10, ----每页显示的记录个数
@page int = 1, ----要显示那一页的记录
@fldSort nvarchar(200) = null, ----排序字段列表或条件
@Sort bit = 0, ----排序方法，1为升序，0为降序(如果是多字段排列Sort指代最后一个排序字段的排列顺序(最后一个排序字段不加排序标记)--程序传参如：' SortA Asc,SortB Desc,SortC ')
@strCondition nvarchar(1000) = null, ----查询条件,不需where
@ID nvarchar(150), ----主表的主键
@Dist bit = 0, ----是否添加查询字段的 DISTINCT 默认0不添加/1添加
@pageCount int = 1 output, ----查询结果分页后的总页数
@Counts int = 1 output ----查询到的记录数
)
AS
SET NOCOUNT ON
Declare @sqlTmp nvarchar(1000) ----存放动态生成的SQL语句
Declare @strTmp nvarchar(1000) ----存放取得查询结果总数的查询语句
Declare @strID nvarchar(1000) ----存放取得查询开头或结尾ID的查询语句
Declare @strSortType nvarchar(10) ----数据排序规则A
Declare @strFSortType nvarchar(10) ----数据排序规则B
Declare @SqlSelect nvarchar(50) ----对含有DISTINCT的查询进行SQL构造
Declare @SqlCounts nvarchar(50) ----对含有DISTINCT的总数查询进行SQL构造
if @Dist = 0
begin
set @SqlSelect = 'select '
set @SqlCounts = 'Count(0)'
end
else
begin
set @SqlSelect = 'select distinct '
set @SqlCounts = 'Count(DISTINCT '+@ID+')'
end
if @Sort=0
begin
set @strFSortType=' DESC '
set @strSortType=' DESC '
end
else
begin
set @strFSortType=' ASC '
set @strSortType=' ASC '
end
if(@fldSort is not null and @fldSort<>'')
begin
set @fldSort=','+@fldSort
end
else
begin
set @fldSort=' '
end
--------生成查询语句--------
--此处@strTmp为取得查询结果数量的语句
if @strCondition is null or @strCondition='' --没有设置显示条件
begin
set @sqlTmp = @fldName + ' From ' + @tblName
set @strTmp = @SqlSelect+' @Counts='+@SqlCounts+' FROM '+@tblName
set @strID = ' From ' + @tblName
end
else
begin
set @sqlTmp = + @fldName + 'From ' + @tblName + ' where (1>0) ' + @strCondition
set @strTmp = @SqlSelect+' @Counts='+@SqlCounts+' FROM '+@tblName + ' where (1>0) ' + @strCondition
set @strID = ' From ' + @tblName + ' where (1>0) ' + @strCondition
end
----取得查询结果总数量-----
exec sp_executesql @strTmp,N'@Counts int out ',@Counts out
declare @tmpCounts int
if @Counts = 0
set @tmpCounts = 1
else
set @tmpCounts = @Counts
--取得分页总数
set @pageCount=(@tmpCounts+@pageSize-1)/@pageSize
/**//**当前页大于总页数 取最后一页**/
if @page>@pageCount
set @page=@pageCount
--/*-----数据分页2分处理-------*/
declare @pageIndex int --总数/页大小
declare @lastcount int --总数%页大小
set @pageIndex = @tmpCounts/@pageSize
set @lastcount = @tmpCounts%@pageSize
if @lastcount > 0
set @pageIndex = @pageIndex + 1
else
set @lastcount = @pagesize
--为配合显示
--set nocount off
--select @page curpage,@pageSize pagesize,@pageCount countpage,@tmpCounts [Rowcount]
--set nocount on
--//***显示分页
if @strCondition is null or @strCondition='' --没有设置显示条件
begin
if @pageIndex<2 or @page<=@pageIndex / 2 + @pageIndex % 2 --前半部分数据处理
begin
if @page=1
set @strTmp=@SqlSelect+' top '+ CAST(@pageSize as VARCHAR(40))+' '+ @fldName+' from '+@tblName
+' order by '+ @ID+' '+ @strFSortType+@fldSort
else
begin
set @strTmp=@SqlSelect+' top '+ CAST(@pageSize as VARCHAR(40))+' '+ @fldName+' from '+@tblName
+' where '+@ID
if @Sort=0
set @strTmp = @strTmp + '>(select max('
else
set @strTmp = @strTmp + '<(select min('
set @strTmp = @strTmp + @ID +') from ('+ @SqlSelect+' top '+ CAST(@pageSize*(@page-1) as Varchar(20)) +' '+ @ID +' from '+@tblName
+' order by '+ @ID+' '+ @strFSortType+@fldSort+') AS TBMinID)'
+' order by '+ @ID+' '+ @strFSortType+@fldSort
end
end
else
begin
set @page = @pageIndex-@page+1 --后半部分数据处理
if @page <= 1 --最后一页数据显示
set @strTmp=@SqlSelect+' * from ('+@SqlSelect+' top '+ CAST(@lastcount as VARCHAR(40))+' '+ @fldName+' from '+@tblName
+' order by '+ @ID +' '+ @strSortType+@fldSort+') AS TempTB'+' order by '+ @ID+' '+ @strFSortType+@fldSort
else
begin
set @strTmp=@SqlSelect+' * from ('+@SqlSelect+' top '+ CAST(@pageSize as VARCHAR(40))+' '+ @fldName+' from '+@tblName
+' where '+@ID
if @Sort=0
set @strTmp=@strTmp+' <(select min('
else
set @strTmp=@strTmp+' >(select max('
set @strTmp=@strTmp+ @ID +') from('+ @SqlSelect+' top '+ CAST(@pageSize*(@page-2)+@lastcount as Varchar(20)) +' '+ @ID +' from '+@tblName
+' order by '+ @ID +' '+ @strSortType+@fldSort+') AS TBMaxID)'
+' order by '+ @ID +' '+ @strSortType+@fldSort+') AS TempTB'+' order by '+ @ID+' '+ @strFSortType+@fldSort
end
end
end
else --有查询条件
begin
if @pageIndex<2 or @page<=@pageIndex / 2 + @pageIndex % 2 --前半部分数据处理
begin
if @page=1
set @strTmp=@SqlSelect+' top '+ CAST(@pageSize as VARCHAR(40))+' '+ @fldName+' from '+@tblName
+' where 1=1 ' + @strCondition + ' order by '+ @ID+' '+ @strFSortType+@fldSort
else
begin
set @strTmp=@SqlSelect+' top '+ CAST(@pageSize as VARCHAR(40))+' '+ @fldName+' from '+@tblName
+' where '+@ID
if @Sort=0
set @strTmp = @strTmp + '>(select max('
else
set @strTmp = @strTmp + '<(select min('
set @strTmp = @strTmp + @ID +') from ('+ @SqlSelect+' top '+ CAST(@pageSize*(@page-1) as Varchar(20)) +' '+ @ID +' from '+@tblName
+' where (1=1) ' + @strCondition +' order by '+ @ID+' '+ @strFSortType+@fldSort+') AS TBMinID)'
+' '+ @strCondition +' order by '+ @ID+' '+ @strFSortType+@fldSort
end
end
else
begin
set @page = @pageIndex-@page+1 --后半部分数据处理
if @page <= 1 --最后一页数据显示
set @strTmp=@SqlSelect+' * from ('+@SqlSelect+' top '+ CAST(@lastcount as VARCHAR(40))+' '+ @fldName+' from '+@tblName
+' where (1=1) '+ @strCondition +' order by '+ @ID +' '+ @strSortType+@fldSort+') AS TempTB'+' order by '+ @ID+' '+ @strFSortType+@fldSort
else
begin
set @strTmp=@SqlSelect+' * from ('+@SqlSelect+' top '+ CAST(@pageSize as VARCHAR(40))+' '+ @fldName+' from '+@tblName
+' where '+@ID
if @Sort=0
set @strTmp = @strTmp + '<(select min('
else
set @strTmp = @strTmp + '>(select max('
set @strTmp = @strTmp + @ID +') from('+ @SqlSelect+' top '+ CAST(@pageSize*(@page-2)+@lastcount as Varchar(20)) +' '+ @ID +' from '+@tblName
+' where (1=1) '+ @strCondition +' order by '+ @ID +' '+ @strSortType+@fldSort+') AS TBMaxID)'
+' '+ @strCondition+' order by '+ @ID +' '+ @strSortType+@fldSort+') AS TempTB'+' order by '+ @ID+' '+ @strFSortType+@fldSort
end
end
end
------返回查询结果-----
SET NOCOUNT off
exec sp_executesql @strTmp
print @strTmp
GO
SET QUOTED_IDENTIFIER OFF
GO
SET ANSI_NULLS ON
GO
----------------------
PaginationByTableName 函数
----------------------------------------------------
public static DataSet PaginationByTableName(string field, string asc_desc, int pagesize, int start, string tableName)
{
//string sql = String.Format("WITH MOVIES AS ( " +
// " SELECT ROW_NUMBER() OVER " +
// " (ORDER BY " + field + " " + asc_desc + " ) AS Row," +
// " *" +
// " FROM " + tableName + " )" +
// " SELECT *" +
// " FROM MOVIES " +
// " WHERE Row between ({0}-1)* {1}+1 and {0}*{1}", start, pagesize);
string sql = "proc_DataPagination";
SqlParameter[] paras = new SqlParameter[9];
paras[0] = new SqlParameter();
paras[0].ParameterName = "@tblName";
paras[0].Value = tableName;
paras[1] = new SqlParameter();
paras[1].ParameterName = "@fldName ";
paras[1].Value = "au_id ,au_lname,au_fname,phone";
paras[2] = new SqlParameter();
paras[2].ParameterName = "@pageSize";
paras[2].Value = pagesize;
paras[3] = new SqlParameter();
paras[3].ParameterName = "@page";
paras[3].Value = start;
paras[4] = new SqlParameter();
paras[4].ParameterName = "fldSort";
paras[4].Value = "";
paras[5] = new SqlParameter();
paras[5].ParameterName = "@Sort";
paras[5].Value = "1";
paras[6] = new SqlParameter();
paras[6].ParameterName = "@strCondition";
paras[6].Value = "";
paras[7] = new SqlParameter();
paras[7].ParameterName = "@ID";
paras[7].Value = "au_id";
paras[8] = new SqlParameter();
paras[8].ParameterName = "@Dist";
paras[8].Value = 0;
return ExtAccess.GetMoreRow(sql,paras);
}
#55楼[
楼主]2009-04-11 09:51 |
你好
请查看本博客置顶篇
结合ext的tree和grid 等
涉及较多基础知识
里面不仅有源代码 而且包含了ext2.2版本
数据库需要使用sql server 2005（务必注意）
希望对你有所帮助
#56楼[
楼主]2009-04-11 09:52 |
@子风
你好
请查看本博客置顶篇
结合ext的tree和grid 等
涉及较多基础知识
里面不仅有源代码 而且包含了ext2.2版本
数据库需要使用sql server 2005（务必注意）
希望对你有所帮助
谢谢了，我的是2000的数据库，这几天就装个2005的
你的demo已经下了，很不错
另外你的Ext系列对我帮助很大，谢谢了。
#58楼[
楼主]2009-04-13 09:33 |
--引用--------------------------------------------------
子风: 谢谢了，我的是2000的数据库，这几天就装个2005的
你的demo已经下了，很不错
另外你的Ext系列对我帮助很大，谢谢了。
--------------------------------------------------------
呵呵
Request["sort"],Request["dir"]在哪传的
#60楼[
楼主]2009-05-05 10:46 |
--引用--------------------------------------------------
琪琪: Request["sort"],Request["dir"]在哪传的
--------------------------------------------------------
Ext.GridPanel组件的内部机制
就算Request["sort"],Request["dir"]是内部机制，也应该有赋值的地方吧，在哪赋值呢
#62楼[
楼主]2009-05-06 06:56 |
--引用--------------------------------------------------
琪琪: 就算Request["sort"],Request["dir"]是内部机制，也应该有赋值的地方吧，在哪赋值呢
--------------------------------------------------------
是否可以赋值，我一直没有测试过，不过我想是在store.load({params:{start:0,limit:15}});这里吧，有时间测试下
为什么你的代码到我机子上就是不显示数据啊 到朋友机子上就可以 是什么原因呢
版大人啊 是不是你这框架跟硬件也有关系的啊 我用的vs2008和sql2008的数据库啊
版大人啊 是不是你这框架跟硬件也有关系的啊 我用的vs2008和sql200的数据库啊
5版大人啊 是不是你这框架跟硬件也有关系的啊 我用的vs2008和sql2005的数据库啊
胜哥 有空吗 可不可以给我写一个可以模糊查询在显示在grid里面的例子啊 我搞了几天了 头都烂了 可就是搞不出来 拜托啦 我邮箱383028891@qq.com 谢谢
#68楼[
楼主]2009-05-10 07:13 |
--引用--------------------------------------------------
刘liu: 胜哥 有空吗 可不可以给我写一个可以模糊查询在显示在grid里面的例子啊 我搞了几天了 头都烂了 可就是搞不出来 拜托啦 我邮箱383028891@qq.com 谢谢
--------------------------------------------------------
没有问题 等我有空时吧 最近忙
#71楼[
楼主]2009-05-21 10:49 |
--引用--------------------------------------------------
じ☆甲壳虫じ: 唯一的遗憾就是全文无一句注释
--------------------------------------------------------
我英文不好 担心翻译出现的错误误导大家 呵呵
版主小弟给你个建议：像我们这种新手能不能把上面的功能简单化些，就纯粹做个显示功能，因为代码太多看的人迷糊。
#73楼[
楼主]2009-05-21 14:22 |
--引用--------------------------------------------------
じ☆甲壳虫じ: 版主小弟给你个建议：像我们这种新手能不能把上面的功能简单化些，就纯粹做个显示功能，因为代码太多看的人迷糊。
--------------------------------------------------------
好的
<script language="javascript" type="text/javascript">
function Ready(){
var url="ExtGridJson.aspx?Param=Select";
var sm=new Ext.grid.CheckboxSelectionModel();
var cm=new Ext.grid.ColumnModel
([
sm,
{header:"编号",dataIndex:"ID"},
{header:"姓名",dataIndex:"Name"},
{header:"性别",dataIndex:"Sex"},
{header:"年龄",dataIndex:"Age"},
{header:"籍贯",dataIndex:"Hometown"},
{header:"出生日期",dataIndex:"Birthday"}
]);
cm.defaultSortable=true;
var fields=[{name:"ID"},{name:"Name"},{name:"Sex"},{name:"Age"},{name:"Hometown"},{name:"Birthday"}];
var store=new Ext.data.Store
({
proxy:new Ext.data.HttpProxy({url:url}),
reader:new Ext.data.JsonReader({totalProperty:"totalProperty",root:"root",fields:fields})
});
store.load({params:{start:0,limit:10}});
var pagingBar=new Ext.PagingToolBar
({
displayInfo:true,
emptyMsg:"没有数据显示",
displayMsg:"显示从{0}条记录到第{1}条记录，共{2}条数据",
store:store,
pageSize:10
});
var grid=new Ext.grid.GridPanel
({
id:"gridPanelDemo",
readerTo:document.body,
layout:"fit",
frame:true,
border:true,
width:600,
height:450,
autoScroll:true,
store:store,
sm:sm,
cm:cm,
viewConfig:{forceFit:true},
title:'Ext表格实例',
bbar:pagingBar
});
}
Ext.onReady(Ready);
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>
ExtGridJson.aspx.cs 文件：
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
public partial class ExtGridJson : System.Web.UI.Page
{
void SelectAll(string field, string asc_desc, int pagesize, int start)
{
string json = "";
try
{
DataSet ds = ExtUtil.PaginationByTableName(field, asc_desc, pagesize, start, "Person");
if (ds != null && ds.Tables[0].Rows.Count > 0)
{
json = ExtUtil.GetJsonString(ds);
int count = ExtUtil.GetCountByTableName("Person");
json = "{totalPorperty:" + count + ",root:" + json + ")";
}
}
catch (Exception ex)
{
string error = ex.Message;
}
Response.Write(json);
}
void SelectAll()
{
SqlDatabaseAccess access = new SqlDatabaseAccess("connStr");
string sql = "Select * from Person";
string json = "";
try
{
DataSet ds = access.ExecuteDataSetBySql(sql, null);
if (ds != null && ds.Tables[0].Rows.Count > 0)
{
json = ExtUtil.GetJsonString(ds);
int count = ExtUtil.GetCountByTableName("Person");
json = "{totalPorperty:" + count + ",root:" + json + ")";
}
}
catch (Exception ex)
{
string error = ex.Message;
}
Response.Write(json);
}
protected void Page_Load(object sender, EventArgs e)
{
int pagesize = 10;
int start = 1;
string field, asc_desc;
if (string.IsNullOrEmpty(Request["sort"]))
{
field = "ID";
asc_desc = "desc";
}
else
{
field = Request["sort"];
asc_desc = Request["dir"];
}
if (!string.IsNullOrEmpty(Request["limit"]))
{
pagesize = int.Parse(Request["limit"]);
start = int.Parse(Request["start"]);
}
start = start / pagesize;
start += 1;
string param = Request["Param"];
switch (param)
{
case "Select":
SelectAll(field, asc_desc, pagesize, start);
break;
default:
break;
}
}
}
以上是我照殷老师的例子写的，请殷老师帮我看看，为什么在页面中显示的是一片空白，而显示不出表格。