日期:2014-05-16  浏览次数:20405 次

extjs学习笔记(四)带分页的grid

很多时候,我们需要显示在grid中的数据不是短短的几条或者几十条,而是成千上万条。如果让大量的数据一股脑全都显示在一个页面中,可以想象会造成什么样的用户体验。因此,现在几乎所有的grid控件都会支持分页功能。extjs也不例外,它对分页也提供了强大而方便的支持,使得我们在分页处理上可以得心应手。
??? 在extjs中,类Ext.PagingToolbar封装了关于分页的操作,该类从Toolbar继承而来,单从名字上看,我们也猜得出这是一个能够处理分页的工具栏。好吧,那我们就来看看如何构造这样一个工具栏吧。PagingToolbar类的构造函数需要一个json对象来进行配置,在js中,使用json对象来提供所需参数非常方便,这样使得我们可以只填写感兴趣的参数,并且不必关心参数的顺序。我们的分页工具栏常用的配置参数包括:
??? pageSize:每页显示的记录数,默认是20。
??? store:这个和grid里边的store参数是一样的,因为分页也需要和数据打交道,所以需要这个参数。
??? displayMsg:显示的分页状态信息,例如“第{0}-第{1}条,一共{2}条",注意一定要有大括号括起来的0,1,2,分别代表当前页的开始,结束,还有全部的记录数,其它的字自己随便写吧,只要读起来通顺就可以了,该信息会显示在分页工具栏的右侧。
??? displayInfo:是否显示displayMsg,默认是不显示。
??? emptyMsg:没有记录时显示的文本。
??? items:要在工具栏上显示的项,我们在构造之后再来看一下都可以有哪些项。

??? 好了,现在可以构造我们的分页工具栏了,不过因为我们的参数里边需要一个Store类的对象,所以我们先来构造它:

<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->?1var?store?=?new?Ext.data.JsonStore(????????root:?'topics',
?3????????idProperty:?'threadid',
?5
?7????????????'title',?'forumtitle',?'forumid',?'author',
?9????????????{?name:?'replycount',?type:?'int'?},
10????????????