Ext JS 4.2.1 - 带寻呼的网格 - 复选框状态丢失 [英] Ext JS 4.2.1 - grid with paging - checkbox state lost

问题描述

我有一个ExtJS网格，具有用于（远程）分页的PagingToolbar，并且复选框列定义为：

  { 
 dataIndex：'selected'，
 xtype：'checkcolumn'，
 width：60 
} 
  

但是，如果我检查一个框，然后页面向前和向后，则不会保存复选框状态 - 所有复选框都未选中。

我猜，由于商店只包含当前页面的数据（从服务器），我需要一些存储不在当前数据页的行的状态，然后在我返回时恢复复选框那个页面。

有没有最佳实践，或者是在分页时将商店的状态存储在商店中？

解决方案

那么这么低级的工作呢，没有人想到要做出最好的做法。如果（！store.checkedItems）store.checkedItems = [];

 
 store.each（function（item）{
 store.checkedItems [item.get（Id）] = item.get（selected）; 
}）; 
}，
 load：function（store）{
 if（！store.checkedItems）store.checkedItems = []; 
 store.each（function（item）{
 item.set（selected，store.checkedItems [item.get（Id）]）; 
}）; 
} 
  

或

  beforeload：function（store）{
 if（！store.checkedItems）store.checkedItems = []; 
 store.each（function（item）{
 store.checkedItems [item.get（Id）] = {selected：item.get（selected）}; //如果你想要扩展保留多个复选框... 
}）; 
}，
 load：function（store）{
 if（！store.checkedItems）store.checkedItems = []; 
 store.each（function（item）{
 item.set（store.checkedItems [item.get（Id）]）; 
}）; 
} 
  

I have an ExtJS grid that has a PagingToolbar for (remote) paging, and a checkbox column defined as:

{
    dataIndex : 'selected',
    xtype: 'checkcolumn',
    width : 60                      
}

However, if I check a box and then page forwards and backwards, the checkbox state is not saved - all the checkboxes are unchecked.

I guess since the store only contains data for the current page (from the server), I need some way of storing the state for rows that are not in the current page of data, and then reinstating the checkboxes when I return to that page.

Is there a best practice, or example of storing the checkbox state in the store while paging?

解决方案

Well, that's so low-level work that no one has yet thought to make a "best practice" for it. E.g.

beforeload:function(store) {
    if(!store.checkedItems) store.checkedItems = [];
    store.each(function(item) {
        store.checkedItems[item.get("Id")] = item.get("selected");
    });
},
load:function(store) {
    if(!store.checkedItems) store.checkedItems = [];
    store.each(function(item) {
        item.set("selected",store.checkedItems[item.get("Id")]);
    });
}

or

beforeload:function(store) {
    if(!store.checkedItems) store.checkedItems = [];
    store.each(function(item) {
        store.checkedItems[item.get("Id")] = {selected: item.get("selected") }; // extensible if you want to keep more than one checkbox...
    });
},
load:function(store) {
    if(!store.checkedItems) store.checkedItems = [];
    store.each(function(item) {
        item.set(store.checkedItems[item.get("Id")]);
    });
}

这篇关于Ext JS 4.2.1 - 带寻呼的网格 - 复选框状态丢失的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！