`

ExtJS 4 grid 带参数 查询 分页 store beforeload

阅读更多
转载自:http://blog.sina.com.cn/s/blog_6d1c583c0100vkr2.html
先上核心代码,恍然大悟的直接去修改代码吧!


store.on('beforeload', function (store, options) {

        var new_params = { name: Ext.getCmp('search').getValue() };
        Ext.apply(store.proxy.extraParams, new_params);
        // alert('beforeload');
    });

 

 

在Ext 3 中的

store.on('beforeload', function () {
            store.baseParams = {
                name: '5555555',
                intss: '666666666'
            };
        });

已经不适合与ext4 系列了。

 

下面给出完整的代码。原理很简单,将搜索条件放在store的baseParams中,每次加载都赋值。

只是需要强制赋值,因为默认的pagetoolbar只会把start、limit、page、sort、dir传递给store。

var store = new Ext.data.Store({
       pageSize: GridPageSize,
       model: 'Master',
       autoLoad: false,
       proxy: {
           type: 'ajax',
           url: '/master/GetMasterData',
           reader: {
               type: 'json',
               root: 'data',
               totalProperty: 'totalCount'
           }
       },
       fields: [
           { name: 'Id' },
           { name: 'Master_Name' }
         

       //排序
       sorters: [{
           property: 'Master_Name',
           direction: 'DESC'
       }]
      


   });


store.on('beforeload', function (store, options) {

        var new_params = { name: Ext.getCmp('search').getValue() };
        Ext.apply(store.proxy.extraParams, new_params);
        // alert('beforeload');
    });

store.load({
       params: { start: 0, limit: GridPageSize }
   })

分享到:
评论

相关推荐

    ExtJS笔记---Grid实现后台分页

    这篇“ExtJS笔记——Grid实现后台分页”探讨了如何在ExtJS的Grid组件中实现高效的后台分页功能。 后台分页是一种常见的数据处理策略,特别是在大数据量的情况下,它将数据分批加载,避免一次性加载所有记录导致的...

    Extjs grid分页1

    4. **自定义分页**:如果需要更复杂的分页逻辑,例如服务器端分页,可以自定义`proxy`的`load`方法,将`start`和`limit`参数(分别表示起始位置和每页记录数)传递给服务器,服务器返回对应页的数据。 5. **事件...

    动画效果的grid分页

    在ExtJS框架中,我们可以实现具有动画效果的grid分页,提升用户交互的流畅性和视觉吸引力。 首先,让我们了解一下ExtJS。ExtJS是一个流行的JavaScript库,提供了丰富的组件和工具,用于构建复杂的、功能强大的Web...

    extjs grid

    ### ExtJS Grid 行跨页选中的实现方法 在ExtJS Grid组件的使用过程中,有时候我们需要实现行跨页选中的功能。此功能主要是为了解决当用户在一个分页的Grid中选择某一行后,在翻页时依然保持该行被选中的状态。本文...

    EXTJS2.x_pagingstore.zip

    4. **监听事件**:你可以监听`load`事件来响应数据加载完成,`beforeload`事件可以在数据加载前执行某些操作,如添加额外的请求参数。 5. **自动加载**:通过设置`autoLoad`配置项,可以决定分页存储是否在创建后...

    分页EXT分页EXT

    EXTJS中的分页组件称为`Ext.picker.Paging`或`Ext.toolbar.Paging`,它通常与`Ext.grid.Panel`(表格组件)一起使用,以处理大量数据。分页工具栏包含上一页、下一页、跳转到指定页和显示每页条目数量的选项。 3. ...

    扩展GridPanel,附带分页选中状态,实现快速构建一个功能齐全的Grid

    在本文中,我们将深入探讨如何扩展ExtJS的GridPanel组件,以实现带有分页和选中状态的功能。ExtJS是一个强大的JavaScript库,用于构建富客户端应用程序,而GridPanel是其核心组件之一,用于展示和操作表格数据。通过...

    EXTJS操作后返回当前操作页

    4. **GridPanel**:`Ext.grid.GridPanel` 创建了数据网格,配置了列模型(Column Model)、选择模型(Row Selection Model)、样式和其他交互功能。`tbar` 和 `bbar` 分别定义了顶部和底部的工具栏,包含添加、编辑...

    extjs3.0 API

    - **插件**:许多功能可以通过插件扩展,例如Grid的分页插件`Ext.grid.PagingToolbar`。 8. **性能优化** - **延迟渲染**:组件的渲染可以在需要时才进行,提高页面加载速度。 - **内存管理和缓存**:合理使用...

    extjs tree

    ExtJS Tree 是一个基于JavaScript的UI组件库ExtJS中的一个重要组成部分,用于构建可交互的树形数据结构。在Web应用程序中,它常被用来展示层级关系的数据,如目录结构、组织架构或者数据库的表关系。ExtJS Tree的...

Global site tag (gtag.js) - Google Analytics