Prevent closing tab in p:tabView using Javascript

Question

I need to prevent tab close in tabView primefaces and i know i can use

onTabClose="return false;"

The problem is I don't want to close tab but i want to make action when close is clicked. When i use onTabClose="return false;" then <p:ajax event="tabClose" listener="#{bean.onTabClose}" update=":growls:mainGrowls"/> is not called.

How can I prevent tab from closing on cross click and call function from bean?

Can i somehow prevent closing in this method?

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

tabView:

<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>

Create a `p:remoteCommand`. Then use `onTabClose="yourRemoteCommand();return false;"`. — Jasper de Vries, Feb 15 '18 at 14:26
Thanks! One more question. In `onTabClose="return false;"` i can use also js `onTabClose="onTabClose(index);return false;"` which gives me index of closing tab. How can I pass this parameter to `p:remoteCommand`? — user3590388, Feb 15 '18 at 14:41
I found the solution: `onTabClose="tabClose(index);return false;"` then in javascript `function tabClose(i){ tabCloseRc([{name: "index", value: i}]);` tabCloseRc is remoteCommand — user3590388, Feb 15 '18 at 14:56

score 1 · Accepted Answer · answered Feb 15 '18 at 14:58

If you want to invoke a method in a managed bean, you could create a p:remoteCommand:

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

This allows you to use yourRemoteCommand() in Javascript, so you could use:

onTabClose="yourRemoteCommand(); return false;"

If you need to send parameters to the remote command, see:

Pass parameter to p:remoteCommand from JavaScript

Prevent closing tab in p:tabView using Javascript

1 Answers1