如何将添加到列表框客户端的值存储到sessionScope

How to store values added to a listbox client side to sessionScope

本文关键字：存储 sessionScope 客户端 列表 添加      更新时间：2023-12-27

我有一个列表框，其中填充了客户端的选项，我需要将该列表框中的值存储到sessionScope中。

这是我的列表框

<xp:listBox id="listBox1"></xp:listBox>

这是我用来填充列表框的jquery

$("[id$='listBox1']").append("<option value='"+ ret + "'>" + ret + "</option>")

这是我必须将列表框保存到sessionScope 的按钮

<xp:button value="Label" id="button1">
    <xp:eventHandler event="onclick" submit="true" refreshMode="complete">
        <xp:this.action><![CDATA[#{javascript:sessionScope.pending = getComponent("listBox1").getValue()}]]></xp:this.action>
    </xp:eventHandler></xp:button>

由于某些原因，列表框值没有保存到我的sessionScope中。如果我在DDE中预先填充列表框，它可以工作，但这不是我想要的。

  • 我还尝试将listBox绑定到数据源，但没有成功
  • 在单击按钮之前，我也尝试过选择值

如何将我在客户端填充的值获取到会话范围中。

完整的代码粘贴到一个新的Xpage，（你需要jquery或引导主题）

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
    <xp:this.data>
        <xp:dominoDocument var="d" formName="Main"></xp:dominoDocument>
    </xp:this.data>
    <xp:button value="ADD TO LISTBOX" id="button2">
        <xp:eventHandler event="onclick" submit="false">
            <xp:this.script><![CDATA[var ret = "Testin"
$("[id$='listBox1']").append("<option value='"+ ret + "'>" + ret + "</option>")]]></xp:this.script>
        </xp:eventHandler>
    </xp:button>
    <xp:listBox id="listBox1" value="#{sessionScope.pending}">
        <xp:eventHandler event="onchange" submit="true" refreshMode="complete"></xp:eventHandler>
    </xp:listBox>
    <xp:br></xp:br>
    <xp:br></xp:br>
    <xp:button value="save" id="button1">
        <xp:eventHandler event="onclick" submit="true" refreshMode="complete">
            <xp:this.action><![CDATA[#{javascript:sessionScope.pending = getComponent("listBox1").getValue()}]]></xp:this.action>
        </xp:eventHandler>
    </xp:button>
    <xp:br></xp:br>
    <xp:br></xp:br>
    <xp:text escape="true" id="computedField1" value="#{sessionScope.pending}"></xp:text>
</xp:view>

这可以通过一个简单的RPC调用来完成。

  1. 在页面中添加RPC，在本例中，我将myRPC视为服务名称。

  2. 为此RPC定义一个函数，该函数将值数组作为输入。函数只是在sessionScope变量中设置此数组。在本例中，我将函数命名为setScopeVariable；

  3. 在您的客户端代码为您的列表框构建值之后，只需调用此RPC函数。这里，listBoxValues是一个包含值列表的数组：myRPC.setScopeVariable（listBoxValues）；

  4. sessionScope现在设置为正确的值。

通过这样做，您将不需要隐藏输入，也不需要刷新页面来设置sessionScope。

这项工作按设计进行：

<xp:listBox
    id="listBox1"
    value="#{sessionScope.pending}">
    <xp:selectItem itemLabel="A"></xp:selectItem>
    <xp:selectItem itemLabel="B"></xp:selectItem>
</xp:listBox>
<xp:button
    value="OK"
    id="button1">
    <xp:eventHandler
        event="onclick"
        submit="true"
        refreshMode="complete">
    </xp:eventHandler>
</xp:button>

我知道，它不会用JQuery填充值，但应该不会有什么不同。。。

免责声明：模型更新可能存在问题-如果组件提交的值不是通过源定义的-<xp:selectItem>。这种情况通常发生在组合框中——提交的值必须与XPage生成的任何值匹配。

我想可以选择以本机方式预先填充列表框选项。如果没有，请尝试一种变通方法：

您可以使用CSJS将选定的值放入绑定到sessionScope的隐藏输入中。那个将被提交。请注意，绑定已从listBox1移动到inputHiden1。

<xp:button
    value="Refresh"
    id="button1">
    <xp:eventHandler
        event="onclick"
        submit="true"
        refreshMode="partial"
        refreshId="inputHidden1">
        <xp:this.script><![CDATA[var lb = dojo.byId("#{id:listBox1}");
var hi = dojo.byId("#{id:inputHidden1}");
hi.value = lb.options[lb.selectedIndex].innerHTML;]]></xp:this.script>
    </xp:eventHandler>
</xp:button>
<xp:inputHidden
    id="inputHidden1"
    value="#{sessionScope.pending}">
</xp:inputHidden>

将值从列表框复制到隐藏输入的脚本可以在列表框的onChange中运行，以避免单击按钮。

另请参阅：XPages-设置viewScope值的客户端代码？

相关文章：