/**
* function 获取当前页数(ExtJs 3.x)
* @return {number}
*/
Ext.PagingToolbar.prototype.getPageNumber =function(){
return this.inputItem.getValue();
}
/**
* function 获取当前页数(ExtJs 2.x)
* @return {number}
*/
Ext.PagingToolbar.prototype.getPageNumber =function(){
return this.field.dom.value;
}
使用方法
先给自己的Ext.PagingToolbar 增加id值
如:
bbar: new Ext.PagingToolbar({
id:'pagingToolbar'
pageSize: pageSize,
store: dataStore,
displayInfo: true,
displayMsg: '当前 第{0}-{1} 条 / 共 {2} 条',
emptyMsg: "没有数据"
})
var pagingToolbar = Ext.getCmp('pagingToolbar')
alert(pagingToolbar.getPageNumber())
如果不写上面的函数,可以通过下面的属性得到:
pagingToolbar.getPageData().activePage
var store = grid.getStore();
var start = store.baseParams.start;
var limit = store.baseParams.limit;
var pageToolbarObj = Ext.getCmp('pageToolbar'+title);
var currentPageNum = pageToolbarObj.getPageData().activePage;
start = limit * (currentPageNum -1);
var end = limit * currentPageNum;
相关推荐
`Ext.PagingToolbar`通常位于EXTJS的GridPanel下方,包含一系列的按钮和输入框,如“第一页”,“上一页”,“下一页”,“最后一页”以及当前页数和总页数的显示。用户可以通过点击这些按钮进行翻页,或者直接在...
displayInfo: true, // 显示当前页和总页数 pageSize: 25 // 每页记录数 }) }); ``` 在这个例子中,我们创建了一个使用DWRProxy的Store,DWRProxy允许我们在后台Java方法和前端JavaScript之间进行透明的数据交换...
displayInfo: true, // 显示当前页和总页数信息 pageSize: 10 // 默认每页显示10条记录 }], columns: [...], // 列定义 }); ``` 压缩包中的两个文件`ext-ui-combo-pagesize.js`和`ext-ui-slider-pagesize.js`...
2. **分页(Paging)**:使用`Ext.grid.Panel`的`pagingToolbar`配置项启用分页。分页栏包含了页码导航,每页记录数选择等控件。默认情况下,刷新会回到第一页。 3. **保持当前页面**:如果你希望刷新时保持在当前...
var pagingToolbar = Ext.create('Ext.toolbar.Paging', { store: myStore, // 关联的数据存储 displayInfo: true, // 是否显示当前页及总页数信息 }); ``` 其中,`store`属性关联了数据存储,`displayInfo`...
displayInfo: true // 显示当前页和总页数 }] }); // 添加到页面 Ext.create('Ext.container.Viewport', { layout: 'fit', // 全屏布局 items: [grid] }); ``` 在上述代码中,`data.json`应替换为实际的数据...
2. **Ext.data.Store与分页配置** `Ext.data.Store`是数据模型的容器,负责加载、存储和管理数据。在创建Store时,我们需要配置分页参数,如`autoLoad`(是否自动加载数据)、`pageSize`(每页显示的数据量)以及`...
2. **EXT Store配置**:分页功能在EXT的Store中实现,需要设置分页参数,如每页记录数(pageSize)、自动加载(autoLoad)和分页控件(pagingToolbar)。此外,Store还需要连接到后台服务器以获取数据。 3. **...
5. **Load Method**:PagingStore加载数据的方法,它会根据当前页数和分页大小向服务器发送请求。 6. **Listeners**:监听事件,例如载入数据完成、页面改变等,允许开发者在这些事件触发时执行相应的逻辑。 接下来...
displayInfo: true, // 显示当前页和总页数 dock: 'bottom' }] // 其他Grid配置... }); ``` 总结来说,ExtJS中的分页控件是一个强大的功能,它可以帮助我们有效地管理和展示大量数据。"ux.Andrie.pPageSize...
3. 将Store和PagingToolbar与DataView关联起来: ```javascript var view = new Ext.DataView({ store: store, tpl: '<tpl for="."><div>{name}</div></tpl>', // 数据模板 itemSelector: 'div' }); var ...
3. **状态管理**:确保所有必要的状态变量都得到妥善维护,例如当前页数、总页数等。这有助于防止因状态不一致导致的错误。 4. **数据验证**:在分页请求前后验证数据,确保传入的数据有效且完整,避免因无效数据...
2. **ExtGrid**:ExtGrid是Ext JS中的表格组件,用于显示结构化的数据。它支持多种功能,如排序、过滤、分页、行编辑等。在本例中,开发者创建了一个具有这些特性的ExtGrid实例。 3. **数据展示**:在ExtGrid中,...
3. **数据加载和切换**:当用户点击分页按钮时,`pagingToolbar`会自动更新Store的`loadPage`方法,加载对应页的数据。同时,`store.load()`方法也可以用于手动加载特定页的数据。 4. **自定义分页**:如果需要更...
EXT是一个强大的JavaScript组件库,它提供了完善的分页组件EXT.data.PagingToolbar。在EXT应用中,只需配置数据源和分页参数,即可轻松实现分页功能。EXT的分页不仅包含UI展示,还包含了数据加载、状态管理等完整...
displayInfo: true // 显示当前页和总页数 }] }); ``` 数据源通常连接到一个远程服务器,通过Ajax请求获取数据。EXTJS的Store对象支持远程分页,这意味着当用户翻页时,只请求当前页所需的数据。为此,我们需要...
PagingLoadResult是用于处理分页数据返回的结果对象,它通常包含当前页的数据集合、总页数、每页大小等信息。 1. **分页原理**: 分页是通过限制每次请求的数据量来实现的,用户可以逐页浏览数据,而不是一次性...