Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Using primefaces p:tabView, the refresh of the tabs using p:ajax doesn't work fine. The first time refresh but the next times doesn't refresh

I have a page with a tabView, with 3 tabs, each tab has a tree. The tree of the third tab (DEVICES CATEGORY/TYPE), depends on what I select in the tree of the second tab (CERTIFICATIONS SYSTEM/PROGRAM). I generate the tree of the third tab dynamically when tab changes, using the event "tabChange"

<p:ajax event="tabChange" listener="#{profileMB.onTabChange}" />

When I select an element of the tree of the second tab and I change to the third tab, for the first time, it works OK, but when I return to the second tab and I mark differents nodes of the tree and I change to the third tab, the third tabs doesn't refresh.

The methods of the event it works OK, and generate the tree well.

public void onTabChange(TabChangeEvent event) {
    log.debug(Constants.BEGIN);    
    if(selectedNodesCS!=null && selectedNodesCS.length>0){        
      rootDeviceCategory =
          getDeviceCategoryService().createRootStructure(rootDeviceCategory, null,listCertSystem,listCertProgram);
    }
  }

I tried using the update in the ajax event "tabChange":

<p:ajax event="tabChange" listener="#{profileMB.onTabChange}" update=":formManagerProfile:tabsProfile:tabDC" />

but the console says:

Can not update component "org.primefaces.component.tabview.Tab" with id "formManagerProfile:tabsProfile:tabDC" without a attached renderer

This is the code of my XHTML:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
    xmlns:p="http://primefaces.org/ui"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:fn="http://java.sun.com/jsp/jstl/functions"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets">


    <h:form id="formManagerProfile" style="margin: auto auto">
        <h:panelGroup id="displayManager">

            <p:panelGrid id="panelUp" style="text-align: left;"
                styleClass="panelGridWithoutBorder">
                <p:row>
                    <p:column>
                        <h:outputText value="#{msg['profile.name']}: " for="profileName" />
                    </p:column>
                    <p:column>
                        <h:inputText id="profileName" value="#{profileMB.profileName}"
                            maxlength="64" styleClass="width-100x100" />
                    </p:column>
                </p:row>
                <p:row>
                    <p:column>
                        <h:outputText value="#{msg['profile.profileGroup']}: "
                            for="profileGroup" />
                    </p:column>
                    <p:column>
                        <p:selectOneMenu id="profileGroup"
                            value="#{profileMB.profileGroupSelected}"
                            converter="#{selectOneMenuConverterSelf}">
                            <f:selectItem itemLabel="" itemValue="#{null}" />
                            <f:selectItems id="pgSelectedItem"
                                value="#{profileMB.listProfileGroups}" var="pgItem"
                                itemValue="#{pgItem}" itemLabel="#{pgItem.name}" />
                        </p:selectOneMenu>
                    </p:column>
                    <p:column>
                        <p:commandButton id="editProfileGroup"
                            icon="#{msg['icon.update']}"
                            value="#{msg['button.text.updateProfileGroup']}"
                            title="#{msg['button.text.updateProfileGroup']}"
                            actionListener="#{profileMB.managementProfileGroup}"
                            update=":managerProfileGroupForm :growl"
                            oncomplete="PF('profileGroupManagerDialogWidget').initPosition();PF('profileGroupManagerDialogWidget').show()" />
                    </p:column>
                </p:row>
            </p:panelGrid>
            <p:panel styleClass="text_align_left">
                <p:commandButton id="saveButtonUp" icon="#{msg['icon.save']}"
                    value="#{msg['button.text.save']}"
                    title="#{msg['button.text.save']}"
                    action="#{profileMB.saveProfile}" update=":growl" />
                <p:commandButton id="backButtonUp" icon="#{msg['icon.back']}"
                    value="#{msg['button.text.back']}"
                    title="#{msg['button.text.back']}" action="#{profileMB.backAction}"
                    ajax="false" />
            </p:panel>


        </h:panelGroup>
        <h:panelGroup>
            <p:tabView id="tabsProfile" dynamic="true">
                <p:ajax event="tabChange" listener="#{profileMB.onTabChange}" />
                <p:tab id="tabMenu" title="MENUS">
                    <p:tree value="#{profileMB.rootAction}" var="elementAction"
                        selectionMode="checkbox" selection="#{profileMB.selectedNodes}">
                        <p:treeNode>
                            <h:outputText value="#{elementAction}" />
                        </p:treeNode>
                    </p:tree>

                </p:tab>
                <p:tab id="tabCS" title="CERTIFICATIONS SYSTEM/PROGRAM">
                    <p:tree id="TreeCS" value="#{profileMB.rootCertSystem}"
                        var="elementCS" selectionMode="checkbox"
                        selection="#{profileMB.selectedNodesCS}">
                        <!--                        <p:ajax event="select" listener="#{profileMB.onClickTreeCS}"   /> -->
                        <!--                        <p:ajax event="unselect" listener="#{profileMB.onClickUnSelectTreeCS}"   /> -->
                        <p:ajax async="true" delay="none" immediate="true"
                            process="TreeCS" event="select" />
                        <p:ajax async="true" delay="none" immediate="true"
                            process="TreeCS" event="unselect" />
                        <p:treeNode>
                            <h:outputText value="#{elementCS}" />
                        </p:treeNode>
                    </p:tree>
                </p:tab>
                <p:tab id="tabDC" title="DEVICES CATEGORY/TYPE">
                    <p:tree id="TreeDC" value="#{profileMB.rootDeviceCategory}"
                        var="elementDC" selectionMode="checkbox"
                        selection="#{profileMB.selectedNodesDevCat}">
                        <p:ajax event="select" listener="#{profileMB.onClickTreeDC}" />
                        <p:ajax event="unselect"
                            listener="#{profileMB.onClickUnSelectTreeDC}" />
                        <p:treeNode>
                            <h:outputText value="#{elementDC}" />
                        </p:treeNode>
                    </p:tree>
                </p:tab>
            </p:tabView>
        </h:panelGroup>
    </h:form>
</ui:composition>

I'm using primefaces v5.1, JSF v2.2.8, spring v3.2.5, hibernate v4.2.7 and java v1.7

like image 254
TeTe Avatar asked Nov 14 '14 13:11

TeTe


1 Answers

I found the solution in p:tabView I must used cache="false"

like image 89
TeTe Avatar answered Nov 15 '22 11:11

TeTe