尝试从 CSJS 在 viewscope 中设置 BS 手风琴的状态，但值始终相同（并且不正确）

Question

在我的 XPage 上，我定义了一个 BS 手风琴：

<div class="panel-collapse collapse in" id="collapseOne" aria-expanded="true" style="">
</div>

在按钮上我想保存面板的状态，所以在完全刷新后我想显示手风琴面板之前的状态。

所以我的按钮现在看起来如下：

<xp:button
        value="Label"
        id="button1">
    <xp:eventHandler
        event="onclick"
        submit="true"
        refreshMode="complete">
        <xp:this.script><![CDATA[if ($('#collapseOne').attr('aria-expanded') == "false") {
"#{javascript:viewScope.put('accordian','collapsed')}";
}else{
"#{javascript:viewScope.put('accordian','expanded')}";
}]]></xp:this.script>
    </xp:eventHandler>
</xp:button>

无论手风琴处于何种状态，viewScope 'accordian' 都设置为 'expanded' 即使脚本识别了手风琴的正确状态。

我做错了什么？

更新：

我按照建议设置了 RPC 服务，但它不起作用。我做错了什么？

<xe:jsonRpcService
                                id="rpcServiceSetState">
                            <xe:this.methods>
                                <xe:remoteMethod
                                    name="setPanelState"
                                    loaded="true"
                                    script="viewScope.put('accordian', state)">
                                    <xe:this.arguments>
                                        <xe:remoteMethodArg
                                            name="state"
                                            type="string">
                                        </xe:remoteMethodArg>
                                    </xe:this.arguments>
                                </xe:remoteMethod>
                            </xe:this.methods></xe:jsonRpcService>
                            <xp:button id="btnTriggerRPC" value="Trigger RPC Method">
        <xp:eventHandler
            event="onclick"
            submit="true" refreshMode="complete">
            <xp:this.script><![CDATA[if ($('#collapseOne').attr('aria-expanded') == "false") {
    rpcServiceSetState.setPanelState('collapsed')
}else{
    rpcServiceSetState.setPanelState('expanded')
}]]></xp:this.script>
        </xp:eventHandler>
                            </xp:button>

Answer 1

如果您使用浏览器开发人员工具并查看浏览器上的内容，您就会找到问题的根源。 SSJS 运行s 仅在服务器上，代码的结果被注入 CSJS 函数并传递给浏览器。 CSJS 运行只能在浏览器上使用，不能运行在服务器上使用。

CSJS只是一个要传递给浏览器的字符串。查看 Package Explorer 中的 local\xsp 文件夹并找到您的 XPage。 "if" 语句不能在服务器上运行，只有 #{javascript:...}.

中的所有内容

Sven 说得对，在页面加载和每次刷新时，您调用 viewScope.put() 将值设置为 "collapsed" 和 "expanded"。你运行宁两者都是因为在 SSJS.

中没有 "if" 语句
这可能有助于阐明 https://www.intec.co.uk/understanding-ssjs/，而且我确信我已经在我的 TLCC 网络研讨会视频中介绍了这一点。您需要通过 CSJS 将某些内容传递到隐藏输入字段，然后您可以访问 SSJS 中的隐藏输入并使用它来管理手风琴的状态。

您基本上需要为自定义 JavaScript 小部件构建自己的状态管理，XPages 会自动处理它自己的小部件，如我在此处所述https://www.intec.co.uk/what-domino-makes-trivial-number-one-state-management/.

Answer 2

下面的代码允许我通过 RPC 服务设置视图范围？

<xe:jsonRpcService id="jsonRpcServiceSelected"
        serviceName="rpcService" rendered="true">
        <xe:this.methods>
            <xe:remoteMethod name="setAccordion"
                script="viewScope.put('accordion', selected);">
                <xe:this.arguments>
                    <xe:remoteMethodArg name="selected" type="string" />
                </xe:this.arguments>
            </xe:remoteMethod>

        </xe:this.methods>
    </xe:jsonRpcService>
<xp:button id="btnTriggerRPC" value="Trigger RPC Method">
        <xp:eventHandler
            event="onclick"
            submit="true"
            refreshMode="complete">
            <xp:this.script><![CDATA[if ($('#collapseOne').attr('aria-expanded') == "false") {
rpcService.setAccordion('collapsed');

}else{

    rpcService.setAccordion('expanded');
}]]></xp:this.script>
        </xp:eventHandler>
</xp:button>

尝试从 CSJS 在 viewscope 中设置 BS 手风琴的状态，但值始终相同（并且不正确）

Trying to set state of BS accordian in viewscope from CSJS but value is always the same (and not correct)

javascript

xpages

twitter-bootstrap

尝试从 CSJS 在 vi​​ewscope 中设置 BS 手风琴的状态，但值始终相同（并且不正确）

Trying to set state of BS accordian in viewscope from CSJS but value is always the same (and not correct)

javascript

xpages

twitter-bootstrap

尝试从 CSJS 在 viewscope 中设置 BS 手风琴的状态，但值始终相同（并且不正确）