Ext.grid.GridPanel + asp.net 数据分页
Ext.grid.GridPanel + asp.net 数据分页
【转】http://www.cnblogs.com/tujiang/archive/2009/07/03/1516488.html
客户端显示数据页面,当然也可以用静态的html页面
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="MyQuestionList.aspx.cs" Inherits="MyQuestionList" %>
<!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 href="ExtJS/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
<script src="ExtJS/adapter/ext/ext-base.js" type="text/javascript"></script>
<script src="ExtJS/ext-all.js" type="text/javascript"></script>
<link href="css/Styles.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
Ext.onReady(function() {
var ds = new Ext.data.Store({
url: "GetQuestionList.aspx",
reader: new Ext.data.JsonReader(
{ root: 'datalist', totalProperty: 'totalCount' },
[{ name: 'title', mapping: 'title' },
{ name: 'type', mapping: 'type' },
{ name: 'ct', mapping: 'ct', type: 'date', dateFormat: 'Y-n-j H:i:s' },
{ name: 'state', mapping: 'state' }
]
)
});
var pagingBar = new Ext.PagingToolbar({
pageSize: 30,
store: ds,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display"
});
var gv = new Ext.grid.GridPanel({
title: '问题列表',
el: 'divGvList',
height: 500,
loadMask: { msg: '正在加载数据,请稍侯……' },
autoWidth: true,
store: ds,
viewConfig:{forceFit:true},
columns: [
new Ext.grid.RowNumberer(),
{ header: '标题', dataIndex: 'title', sortable: true },
{ header: '分类', dataIndex: 'type', sortable: true },
{ header: '时间', width: 100, dataIndex: 'ct', sortable: true, renderer: Ext.util.Format.dateRenderer('Y.m.d') },
{ header: '回复状态', width: 80, dataIndex: 'state', sortable: true }
],
bbar: pagingBar
});
gv.render();
ds.load({
params: { start: 0, limit: 30 },
callback: function(r, options, success) {
if (!success) {
alert("加载数据失败,无对应数据或者系统出现异常!");
}
}
});
});
</script>
</head>
<body style="padding-top:10px;">
<form id="form1" runat="server">
<div id="divGvList" style="margin:0 auto; width:99%;"></div>
</form>
</body>
</html>
这个是服务器端读取数据的GetQuestionList.aspx页面
private WebOrder.Server.Service sObj = WebOrder.Server.InterfaceFactory.CreatorServiceObj(); //这个是我自己写的接口类
protected void Page_Load(object sender, EventArgs e)
{
StringBuilder jsonStr = new StringBuilder();
jsonStr.Append("{'datalist':[");
//这里补充下,有朋友问我第一次加载页面数据显示出来了,然后点下一页的时候没数据,不能翻页
//这里的start不是页码,而是表示从第多少条数据开始取,limit是取多少条(也就是说如果是第二页,每页显示6;start=6,limit=6;第三页的时候start=12,limit=6)
int start = Convert.ToInt32(Request.Params["start"].Trim());
int limit = Convert.ToInt32(Request.Params["limit"].Trim());
int rowCount = 0;
WebOrder.Server.QuestionInfo[] qList = sObj.ReadQuestionList(start, limit, out rowCount); //这个是实体类数组,如果测试的话可以自己写数据源,然后格式化成json数据类型返回就可以了
foreach (WebOrder.Server.QuestionInfo item in qList)
{
jsonStr.Append("{");
jsonStr.Append("'title':'" + item.标题 + "',");
jsonStr.Append("'type':'" + item.分类 + "',");
jsonStr.Append("'ct':'" + item.时间 + "',");
jsonStr.Append("'state':'" + (item.是否回复 ? "已回复" : "") + "'");
jsonStr.Append("},");
}
jsonStr.Remove(jsonStr.Length - 1, 1);
jsonStr.Append("],'totalCount':" + rowCount.ToString() + "}");
Response.Write(jsonStr);
//这两行代码不写的话客户端接收不到数据,我弄了好久才发现这个问题,我在博客园其他的博文中也看到有人说就是显示不了数据,不知道和我这个是不是一样的问题,在网上看的例子都是只有Response.Write,然后自己拿来测试又显示不了数据,
//郁闷了一上午,不过总算搞定了,希望对碰到和我一样问题的人能节省点时间
Response.Flush();
Response.Close();
}
此文是我从博客园转过来的,终于解决了自己的分页问题(让我纠结了很久),我是采用的WebService,与上文稍有不同,其实原理是一样的:
int start = Convert.ToInt32(Context.Request.Params["start"].Trim());
int limit = Convert.ToInt32(Context.Request.Params["limit"].Trim());
string sql = "select e.*,d.dep_name from employee e,department d where e.emp_dep=d.dep_id Limit "+limit.ToString()+" offset "+start.ToString()+";select count(*) as countNum from employee;";
start、limit是ds.load({ params: { start: 0, limit: 2} });传过来的参数
至于在WebService中的Response和Request,将前面加上上下文就可以了:
Context.Response.Write(jsonStr.ToString());
Context.Response.Flush();
Context.Response.Close();
Ext.grid.GridPanel + asp.net 数据分页相关推荐
- ExtJs之Ext.grid.GridPanel(部分未完)
今天在家休息,年假不用就作费啊. 看了几部香港老电影,陪爸爸看了勇士占奇才, 然后,测试了一下EXTJS未完的内容, 在京东上订了七本历史普及书,近两百块..:) 搞定. ? 1 2 3 4 5 6 ...
- ASP.NET 数据分页第三篇 - 结合 Custom Control 处理 GridView 的 UI 呈现
延续本系列前两篇帖子「ASP.NET 数据分页第一篇 - 探讨分页原理及 SQL Server 2005 的 ROW_NUMBER 函数」.「ASP.NET 数据分页第二篇 - 范例下载」,本系列的 ...
- 使用Ext.grid.Panel显示远程数据
使用Ext.grid.Panel显示远程数据 对于Ext.grid.Panel而言,它只是负责显示Store数组中心的数据,至于Store保存的数据到底是浏览器本地数据,还是远程服务器的数据,Ext. ...
- Asp.Net 数据分页
.Net 所使用的 ADO.Net较前身ADO在性能上有较大的提升,但是操作起来也较为繁琐,在 Asp 时代,对数据进行分页使用 RecordSet 的 PageSize 和 AbsolutePage ...
- Ext.grid.GridPanel,CheckboxSelectionModel的全选的问题
Ext.grid.CheckboxSelectionModel的小问题: 解决方法: //监视Store数据是否变化, 进行一些其它处理; pl_store.on('datachanged', fun ...
- Ext.grid.GridPanel数据转json
var count = docAdGrid.getStore().getCount(); var jsonArray = []; for (var i = 0; i < count; i++) ...
- Ext Grid Json分页(asp.net)
首先感叹extjs的强大,无以言表! 今天瞎弄了很久的grid,看了很多网上的例子和教程,终于搞定了分页和返回的json数据中存在换行符的问题 . 刚开始参照网上的例子怎么弄都不能分页,经过调试发现d ...
- [转载]ExtJS中grid按照中文拼音首字母排序、改变行背景、列背景、静态数据分页不再困难...
代码 1 本示例主要使用到了静态数据分页 Ext.data.PagingMemoryProxy组件.Ext.PagingToolbar分页条.viewConfig的getRowClass 方法.列co ...
- Ext.grid.Panel表格分页
Ext.grid.Panel表格分页示例 代码: cshtml @{Layout = null; } <!DOCTYPE html> <html> <head>&l ...
最新文章
- java都市男人心痒痒_说的男人心痒痒的情话 让男人心痒痒的话,谁能帮我弄几句呀?...
- hihocoder1260,1261 (HASH经典题)
- webpack --- [读书笔记] webpack中常用的一些配置项
- JavaFX技巧23:节省内存! 属性的阴影场
- python .py文件变为.so文件进行加密
- Inside Class Loaders
- iPhone 14 Pro将采用开孔全面屏:明年iPhone 15全系标配
- 旺旺上显示已上传服务器,在服务器上排除问题的头五分钟 | 旺旺知识库
- C#分析URL参数获取参数和值得对应列表(一)
- VBScript Sample:遍历文件夹并获取XML文件中指定内容
- 数字图像处理第三版(冈萨雷斯)笔记,2020
- APP开发的七大阶段,你了解多少?
- 量子计算机采用超导技术吗,华人学者一作论文发现不寻常超导体,或可作为量子计算机的“硅”...
- 【安全通告】创宇安全智脑:GitLab ExifTool远程命令执行漏洞在野利用(CVE-2021-22205)...
- 我的程序人生——初识代码,从学好C语言开始
- JavaScript 各种参数 详解(十二)
- 那些服务器平台支持nvme,最新网吧无盘服务器能用NVME的M.2 SSD吗?
- project2010如何插入子任务?
- XManager使用说明
- MaxCompute SQL的SELECT语法
热门文章
- 一张图看完成都云栖大会的精彩,请用心感受!
- 统计一个数组中正数和负数的个数
- oninput,onpropertychange,onchange的使用方法和差别
- How Setting Show Transaction Code on SAP Tree Menu Side.
- APICACHE : Express/Node的API响应缓存中间件
- 你解决的问题比你编写的代码更重要! 1
- Docker的今生前世,关于Docker的一些见解
- 图片服务 - thumbor启用AutoJPG
- Java面试 - List和Set比较,各自的子类比较
- 【python】Macbook M1/M1pro/M1max 安装anaconda记录