Ext JS Grid视图中的会话存储代理实现中面临的问题

时间:2018-07-13 02:13:23

标签: javascript gridview extjs store session-storage

我刚刚创建了一个Sencha小提琴,其中有一个面板带有两个网格视图。两个网格视图都有助于从左到右选择项目,反之亦然。我正在尝试将所选项目从左侧网格视图显示为右侧网格视图。我正在使用sessionStorage代理在从左向右网格视图移动项目时保存数据。我必须使用sessionStorage,因为我的要求是在整个页面上保持此选择。

Sencha小提琴链接:https://fiddle.sencha.com/#view/editor&fiddle/2j7u

虽然,我没有收到任何错误,但是我的实现无法正常工作。甚至控制台日志也显示正确的选择数据。但是我仍然无法填充正确的网格视图。

我注意到的一件事是在Applcation-> SessionStorage下的浏览器调试器中,我的sessionStorage对象始终为null。不知道为什么,但是在控制台上它会显示数据。

Console logs from fiddle

sessionStorage value from debugger

任何指针将不胜感激!

顺便提一句,相同的实现在Ext JS 4.2下运行良好。但是我在迁移到Ext JS 6.5时遇到问题

谢谢, 迪拉伊

进一步的疑难解答:

此外,我还更新了相同的提琴,并成功地将其注释掉,方法是在我的右网格'store'-> store2和'sessionStore'-> sessionStore2中注释掉'suspendEvents'和'resumeEvents' tropos.selectDevices.addToSelect 方法。与此同时,我发现 tropos.selectDevices.updateGridViews 方法中的“ store2.loadPage(1)”行正在加载时清除了我的网格。我试图避免使用'clearOnPageLoad'配置设置将存储设置为false。但是它没有用,所以我评论了这一行以使其起作用。现在,虽然可以使用,但是由于sessionStorage仍然无法使用,我对PRESERVING用户选择的主要要求仍未得到满足。

更新的小提琴: https://fiddle.sencha.com/#view/editor&fiddle/2j7u

谢谢, Dhiraj

1 个答案:

答案 0 :(得分:0)

在您的addToSelect中尝试以下代码:

example.selectDevices.addToSelect = function(storeObj){
    var addRecs = [], newRecs = [],
    store2 = Ext.getCmp('grid2').getStore();

    //********************  
    //I just comment all  *sessionStore2* references because is redundand,
    //store2 is the same as sessionStore2 
    //********************

    //sessionStore2 = Ext.data.StoreManager.lookup('currentlySelectedDevices');
    //store2.suspendEvents();
    //sessionStore2.suspendEvents();

    Ext.each(storeObj,function(record){
        var rec = record.copy();
        rec.phantom = true;
        addRecs.push(rec);
        newRecs.push(record.data.hid);
    });
    example.selectDevices.selectedDeviceIds = example.selectDevices.selectedDeviceIds.concat(newRecs);
    store2.add(addRecs);
    //store2.commitChanges();

    for(i=0; i < store2.data.items.length; i++) {
        console.log("addToSelect: Selected Device Serial [" + i + "] from STORE_2: " + store2.data.items[i].data.hid);
    }
    //sessionStore2.add(addRecs);

    //for(j=0; j < sessionStore2.data.items.length; j++) {
    //    console.log("addToSelect: Selected Device Serial [" + j + "] from SESSION_STORAGE_2: " + sessionStore2.data.items[j].data.hid);
    //}
    //sessionStore2.sync();

    store2.sync();
    //sessionStore2.resumeEvents();

    example.selectDevices.updateGridViews();
};

编辑:为了使同步正常工作,您必须将记录标记为phantom = true