使用 Javascript 防止在 p:tabView 中关闭选项卡答案

【问题标题】：Prevent closing tab in p:tabView using Javascript使用 Javascript 防止在 p:tabView 中关闭选项卡
【发布时间】：2018-07-26 08:13:37
【问题描述】：

我需要防止 tabView primefaces 中的标签关闭，我知道我可以使用

onTabClose="return false;"

问题是我不想关闭选项卡，但我想在单击关闭时执行操作。当我使用onTabClose="return false;" 时，不会调用<p:ajax event="tabClose" listener="#{bean.onTabClose}" update=":growls:mainGrowls"/>。

如何防止标签在交叉点击时关闭并从 bean 调用函数？

我能以某种方式阻止关闭此方法吗？

public void onTabClose(TabCloseEvent event) {       
    FacesMessage msg = new FacesMessage("Tab Closed", "Closed tab: " + event.getTab().getId());
    FacesContext.getCurrentInstance().addMessage(null, msg);
}

标签视图：

<p:tabView id="tabView" activeIndex="0" style="height: 100%;" onTabClose="return false;">
            <p:ajax event="tabClose" listener="#{bean.onTabClose}" update=":growls:mainGrowls"/>
            <p:tab title="#{tabTitle}" closable="false" >
                <div style="height: 100%; background: #efefef !important">
                    <ui:insert name="tab" />
                </div>
            </p:tab>
            <p:tab title="" closable="true" id="">

            </p:tab>
        </p:tabView>

【问题讨论】：

创建一个p:remoteCommand。然后使用onTabClose="yourRemoteCommand();return false;"。
谢谢！还有一个问题。在onTabClose="return false;" 我也可以使用 js onTabClose="onTabClose(index);return false;" 这给了我关闭标签的索引。如何将此参数传递给p:remoteCommand？
我找到了解决方案：onTabClose="tabClose(index);return false;" 然后在 javascript function tabClose(i){ tabCloseRc([{name: "index", value: i}]); tabCloseRc 是 remoteCommand

标签： ajax jsf primefaces tabs tabview

【解决方案1】：

如果你想调用托管 bean 中的方法，你可以创建一个p:remoteCommand：

<p:remoteCommand name="yourRemoteCommand"
                 actionListener="#{yourBean.yourMethod}" />

这允许您在 Javascript 中使用 yourRemoteCommand()，因此您可以使用：

onTabClose="yourRemoteCommand(); return false;"

如果需要向远程命令发送参数，请参见：

Pass parameter to p:remoteCommand from JavaScript

【讨论】：