ExtJS - GridPanel с Ext.ux.grid.FilterRow и Ext.PagingToolbar - PullRequest
Новая
       38

ExtJS - GridPanel с Ext.ux.grid.FilterRow и Ext.PagingToolbar

1 голос
/ 09 сентября 2010

Я добавил плагин «FilterRow» в GridPanel с помощью PagingToolBar.Сетка работает хорошо, за исключением этой проблемы: если я пытаюсь отсортировать или отфильтровать столбец, сетка сгенерирует переменные POST -> sort, dir и все мои фильтры будут включены.Вместо этого, если я попытаюсь перейти на следующую страницу, это POST-переменные -> sort, dir, start, limit.Если я пытаюсь прокрутить страницы, я теряю ранее опубликованные переменные фильтра.Это мой код: 

Ext.onReady(function(){            

    var store = new Ext.data.JsonStore({
      url: "get-data-for-grid.php",
      root: "rows",
      id:'id',   
      totalProperty:'totalCount',      
      remoteSort: true,
      sortInfo: {
            field: 'genere',
            direction: 'ASC'
      },      
      autoDestroy: true,
      fields: [
         {name: 'scheda'},
         {name: 'topic'},
         {name: 'genere'},
         {name: 'specie'},
         {name: 'autore'},
         {name: 'comme'},
         {name: 'famiglia'},
         {name: 'nomecomune'},
         {name: 'datains'}
      ]
    });

    var filterRow = new Ext.ux.grid.FilterRow({
      autoFilter: false,
      listeners: {
        change: function(data) {
          store.load({
            params: data
          });
        }
      }
    });       

    // create the Grid
      var grid = new Ext.grid.GridPanel({
        store: store,
        loadMask: true,
        columns: [
            {id:'scheda', header: "Scheda", width: 73, align: 'center', sortable: false, renderer: scheda, dataIndex: 'scheda'},                    
            {id:'genere', header: "Genere", width: 130, renderer: gen, sortable: true, dataIndex: 'genere', filter:{ }},
            {id:'specie', header: "Specie", width: 150, sortable: true, renderer: spe, dataIndex: 'specie', filter:{ }},
            {id:'autore', header: "Autore", width: 150, sortable: true, renderer: all, dataIndex: 'autore', filter:{ }},
            {id:'famiglia', header: "Famiglia", width: 150, sortable: true, renderer: fam, dataIndex: 'famiglia', filter:{ }},
            {id:'nomecomune', header: "Nome Comune", width: 190, sortable: true, renderer: all, dataIndex: 'nomecomune', filter:{ }},
            {id:'datains', header: "Aggior.", width: 75, sortable: true, renderer: data, dataIndex: 'datains'}   
        ],
        highlightClasses: {
          ASC:  'x-custom-sort-asc'
          // DESC stays at default = x-ux-col-sort-desc
        },        
        bbar: new Ext.PagingToolbar({
            pageSize: 15,
            store: store,
            displayInfo: true
        }),    
        plugins: [filterRow],

        height:660,
        width:1010,
        frame:true,                
        title:
        '<div align="center"><img src="images/testata_micologia.jpg" alt="" height="68" width="974" border="0"></div>',
        renderTo: "grid-example"
      });          

    grid.render('grid-example');

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

Как "Ext.PagingToolbar" может генерировать POST-переменные фильтра, ранее опубликованные (в моем примере, genere, specie, autore, .. ...)

1 Ответ

0 голосов
/ 10 сентября 2010

Чтобы сохранить параметры фильтра, вы должны использовать свойство baseParams вместо свойства params магазина.

The *Свойство 1009 * baseParams будет сохраняться во всех вызовах метода load.

Поэтому я бы реализовал это в вашем change слушателе вашего FilterRow: 

    change: function(data) {
      Ext.apply(store.baseParams, data);
      store.load({params:{start:0, limit:15}});
    }
...