重新加载时 dojo 树复选框丢失

Question

我正在处理 .jsp 页面，spring MVC，dojo 1,10.2。我创建了 JSP 页面，其中包含带复选框的 dojo 树。当我单击下一步按钮时，它将转到下一个 jsp 页面。如果我按下后退按钮，树会重新加载并且所有复选框都未选中。

如何在按下后退按钮时选中所有先前选中的复选框。我是否需要在转到下一页之前保存复选框状态，然后选中引用已保存数据的复选框。

还有其他方法可以实现吗？

Answer 1

网络是一个无状态的地方，所以是的，你必须在某个地方保存状态，有几种方法可以做到这一点......你可以依靠后端服务将它们存储在 databases/files/ ...，或者您可以使用新的 HTML5 功能之一，例如会话存储或本地存储。

以会话存储为例，你可以这样做：

首先你需要一些函数来加载和存储数据。由于您只能在会话和本地存储中存储简单的字符串，我将把它们序列化为 JSON:

var store = {
    save: function(object) {
        sessionStorage.setItem('fruits', JSON.stringify(object));
    },
    load: function() {
        return JSON.parse(sessionStorage.getItem('fruits') || '{}');
    }
};

然后在每次更改时您都可以存储数据：

registry.byId("apple").on("change", function(value) {
    fruits.apple = value;
    store.save(fruits);
});
registry.byId("banana").on("change", function(value) {
    fruits.banana = value;
    store.save(fruits);
});
registry.byId("lemon").on("change", function(value) {
    fruits.lemon = value;
    store.save(fruits);
});

最初您可以加载数据：

var fruits = store.load();

并使用它来初始化小部件的状态：

registry.byId("apple").set("value", fruits.apple || false);
registry.byId("banana").set("value", fruits.banana || false);
registry.byId("lemon").set("value", fruits.lemon || false);

这是一个示例：http://jsfiddle.net/3b2s15xm/尝试更改选项并重新加载页面。通常复选框会再次取消选中，但现在它实际上会在您加载页面时从会话存储中重新加载数据。

您需要了解的一件事是您需要支持的浏览器是否具有这些 HTML5 功能，您可以在 caniuse.com.

上查看这些功能

重新加载时 dojo 树复选框丢失

dojo tree checkbox lost when reload

checkbox

dojo

reload