Javascript sessionScope HashMap&；复选框

问题

我遇到了一个严重的问题（也许这更像是一个理解问题？）？事情是这样的：

• 我的网站有很多支票盒。单击其中一个时，ajax调用仅用于将checbox信息存储到sessionScope hashmap中。这很有效
• 如果取消选中复选框，将再次进行ajax调用，这一次，它将从sessionScrope hashmap中删除该条目。这很有效
• 选中和取消选中非常有用，因为我在每次ajax调用后都会列出hashmap，以查看调试信息

现在。。。如果我用复选框刷新我的主站点，另一个javascript将使用sessionScope hashmap和存储在sessionScope hashmap中的复选框。不言自明，对吧

嗯，在我刷新站点之后，页面看起来像是使用了上一个sessionScope HashMap（意思是在我刷新页面之前的sessionScope HashMap）。但是，它并没有在这里结束。第二次刷新后，将显示正确的结果。第三次刷新后，它将显示上一个HashMap状态，因此将保持不变：|

我是不是遗漏了什么？我一刷新，HashMap就从以前的状态恢复了，没有写入任何内容，只是读取它

这怎么可能

请帮我理解这件事，因为我不知道发生了什么

致以最良好的祝愿

格雷戈

更新（代码）：

复选框页面：

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core"
    xmlns:xc="http://www.ibm.com/xsp/custom">

    <xp:this.resources>
        <xp:styleSheet href="/gama.css"></xp:styleSheet>
        <xp:styleSheet
            href="#{javascript:ROOT_PATH}/js/jquery-ui/css/smoothness/jquery-ui-1.10.3.custom.min.css">
        </xp:styleSheet>
        <xp:script src="/global.jss" clientSide="false"></xp:script>
        <xp:script src="#{javascript:ROOT_PATH}/js/jquery-2.0.3.min.js"
            clientSide="true">
        </xp:script>
        <xp:script
            src="#{javascript:ROOT_PATH}/js/jquery-ui/js/jquery-ui-1.10.3.custom.min.js"
            clientSide="true">
        </xp:script>
        <xp:script src="#{javascript:ROOT_PATH}/gama.js"
            clientSide="true">
        </xp:script>
    </xp:this.resources>


    <xp:this.data>

        <xp:dominoView var="view1" databaseName="***HIDDEN***.nsf"
            viewName="dflt">
        </xp:dominoView>
    </xp:this.data>

    <xp:table style="width:80.0%" border="1">
        <xp:tr>
            <xp:td
                style="width:100.0px;border-bottom: 1px solid #e8e8e8;" valign="top"
                styleClass="xspPanelViewColumnHeader">
                <xp:br></xp:br>
                10.5.*
            </xp:td>
            <xp:td valign="top"
                style="border-bottom: 1px solid #e8e8e8;width:auto">
                <xp:checkBox text="10.5.33" id="checkBox3"></xp:checkBox>
                <xp:checkBox text="10.5.34" id="checkBox4"></xp:checkBox>
                <xp:checkBox text="10.5.35" id="checkBox5"></xp:checkBox>
                <xp:checkBox text="10.5.38" id="checkBox6"></xp:checkBox>
                <xp:checkBox text="10.5.39" id="checkBox7"></xp:checkBox>
                <xp:checkBox text="10.5.40" id="checkBox8"></xp:checkBox>
                <xp:br></xp:br>
                <xp:checkBox text="10.5.49" id="checkBox9"></xp:checkBox>
                <xp:checkBox text="10.5.50" id="checkBox10"></xp:checkBox>
                <xp:checkBox text="10.5.51" id="checkBox11"></xp:checkBox>
                <xp:checkBox text="10.5.54" id="checkBox12"></xp:checkBox>
                <xp:checkBox text="10.5.55" id="checkBox13"></xp:checkBox>
                <xp:checkBox text="10.5.56" id="checkBox14"></xp:checkBox>
            </xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td styleClass="xspPanelViewColumnHeader" valign="top"
                style="border-bottom: 1px solid #e8e8e8;">
                10.6.*
            </xp:td>
            <xp:td style="border-bottom: 1px solid #e8e8e8;">
                <xp:checkBox text="10.6.32" id="checkBox15"></xp:checkBox>

            </xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td styleClass="xspPanelViewColumnHeader"
                style="border-bottom: 1px solid #e8e8e8;">
                192.*
            </xp:td>
            <xp:td style="border-bottom: 1px solid #e8e8e8;">

            </xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td styleClass="xspPanelViewColumnHeader"
                style="border-bottom: 1px solid #e8e8e8;">
                193.*
            </xp:td>
            <xp:td style="border-bottom: 1px solid #e8e8e8;">

            </xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td styleClass="xspPanelViewColumnHeader"
                style="border-bottom: 1px solid #e8e8e8;">
                10.21.*
            </xp:td>
            <xp:td style="border-bottom: 1px solid #e8e8e8;">


                <xp:checkBox text="10.21.8" id="checkBox2"></xp:checkBox>
                <xp:checkBox text="10.21.12" id="checkBox1"></xp:checkBox>
            </xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td styleClass="xspPanelViewColumnHeader" valign="top">
                172.24.*
            </xp:td>
            <xp:td>

            </xp:td>
        </xp:tr>
    </xp:table>
    <xp:br></xp:br>


    <div id="container"></div>



    <xp:eventHandler event="onClientLoad" submit="true"
        refreshMode="norefresh">
        <xp:this.action><![CDATA[#{javascript:

        // GET INFO FROM NETKEYS SESSIONSCOPE AND SAVE IT TO JSON FORMAT
        sessionScope.netKeys = (sessionScope.netKeys || new java.util.HashMap());
        var netKeysJSON:com.ibm.commons.util.io.json.JsonJavaObject = 
          new com.ibm.commons.util.io.json.JsonJavaObject();

        var arr_key = sessionScope.netKeys.keySet();
        //print ("Printing netKeys");
        for (x in arr_key) {
            print(x +" > "+ sessionScope.netKeys[x]);
            netKeysJSON.put(x, sessionScope.netKeys[x]);
        }
        sessionScope.netKeysJSON = "";
        sessionScope.netKeysJSON = netKeysJSON.toString();


        }]]></xp:this.action>
        <xp:this.script><![CDATA[

        // READ ALL JSON ENTRIES AND CHECK SPECIFIC CHECKBOXES!
        myVar = '#{javascript:sessionScope.get("netKeysJSON")}';

        //print("Printing JSON");
        if (myVar.length > 0) {

            var arr = $.parseJSON(myVar);

            for( key in arr ) {
                console.log(key +" >> "+ arr[key]);

                //$("label[for='"+ key +"']").remove();
                $("input[id='"+ key +"']").prop('checked', true);
                loadNetsInfo(arr[key], key, true);
            }

        }

]]></xp:this.script>
    </xp:eventHandler>
</xp:view>

解决方案

正如@stwissel在回答我的问题时所建议的那样，他就是我所做的一切。有了这些，我还优化并替换了javascript，这加快了代码流程

faces-config.xml（通过包资源管理器打开）。请注意，我已经尝试创建它自己的类（您可以这样做来扩展HashMap），但我不需要这样做，因此唯一逻辑和简单的方法就是添加HashMap类型的会话范围的托管bean

  <managed-bean>
    <managed-bean-name>checkBoxStatus</managed-bean-name>
    <managed-bean-class>java.util.HashMap</managed-bean-class>
    <managed-bean-scope>session</managed-bean-scope>
  </managed-bean>

上面的代码只是根据我们在faces中创建的bean来检查或取消选中复选框

现在，我不再从会话数组中创建JSON字符串，然后使用ajax调用从服务器接收信息，而是在复选框中循环，它们的id以复选框开始/结束：

<xp:this.script><![CDATA[
// GO THROUGH ALL CHECKED ELEMENTS, CALL _netsGetInfo
$( "input[id*='checkBox']:checked" ).each(function( index ) {
        var id = $(this).attr('id');
        var ip = $("label[for='"+ id +"']").text();
        var ip_clean = ip.replace(/\./g, "_");

        console.log( index + ": " + id +", "+ ip +", "+ ip_clean );
        loadNetsInfo(ip, id, true);
});
]]></xp:this.script>

_netsGetInfo.xsp不像以前那样管理任何会话HashMap

案件结束，一切工作的魅力

---

非常感谢stwissel和stackoverflow社区。遗憾的是，IBM Developerworks社区对此毫无帮助。

不建议在更改复选框时运行服务器往返。下面是我要做的：将您的复选框绑定到托管bean。例如，称之为checkboxstatus。然后，您的复选框具有value=“#{checkboxstatus['someid']}”绑定将确保正确更新值。 然后，您可以决定是将框的每个更改发送回，还是仅将其发送回用户希望执行的操作。

---

bean可以是默认的HashMap

如果我们能够看到您正在运行的代码，这将非常有帮助-问题可能就在那里。@Chris我已经用代码更新了我的条目。谢谢你的迅速回复。

  <managed-bean>
    <managed-bean-name>checkBoxStatus</managed-bean-name>
    <managed-bean-class>java.util.HashMap</managed-bean-class>
    <managed-bean-scope>session</managed-bean-scope>
  </managed-bean>

<xp:checkBox text="10.5.33" id="checkBox3" value="#{checkBoxStatus['10.5.33']}"></xp:checkBox>

checkBoxStatus['10.5.33'] = true;
checkBoxStatus['10.1.31'] = true;
checkBoxStatus['192.168.1'] = false;
checkBoxStatus['10.6.207'] = true;

<xp:this.script><![CDATA[
// GO THROUGH ALL CHECKED ELEMENTS, CALL _netsGetInfo
$( "input[id*='checkBox']:checked" ).each(function( index ) {
        var id = $(this).attr('id');
        var ip = $("label[for='"+ id +"']").text();
        var ip_clean = ip.replace(/\./g, "_");

        console.log( index + ": " + id +", "+ ip +", "+ ip_clean );
        loadNetsInfo(ip, id, true);
});
]]></xp:this.script>