Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
868 views
in Technique[技术] by (71.8m points)

jsf 2 - How to reference #{cc.clientId} in ajax update/process/render/execute?

I don't know how to reference descendant components of composite component in update or process (alias render or execute).

I have this composite component resources/components/crud.xhtml:

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jsf/composite">

    <c:interface>
        <c:attribute name="controller" required="true" />
        <c:facet name="fields" required="true"/>
    </c:interface>

    <c:implementation>

        <p:dataTable 
            id="table"
            value="#{cc.attrs.controller.autoResultModel}" 
            var="unit" 
            paginator="true" 
            rows="10" 
            lazy="true"  
            paginatorAlwaysVisible="true"
            paginatorPosition="top"
            paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
            currentPageReportTemplate="{totalRecords} records found, Page: {currentPage}/{totalPages}"
            rowsPerPageTemplate="5,10,15" 
            sortBy="#{unit.creationTime}"
            sortOrder="descending"
            selectionMode="single"
            selection="#{cc.attrs.controller.selected}">

            <p:ajax event="rowSelect" update="editDialog trashDialog table:commands"/>

            <f:facet name="header">
                <h:panelGroup id="commands" layout="block">
                    <p:commandButton id="newButton" value="new" image="ui-icon ui-icon-plusthick" oncomplete="editDialog.show()" actionListener="#{cc.attrs.controller.clearSelected()}" process="@this" update="#{cc.clientId}" />
                    <p:commandButton value="edit" image="ui-icon ui-icon-wrench" onclick="editDialog.show()" type="button" disabled="#{cc.attrs.controller.selected.id == null}"/>
                    <p:commandButton value="delete" image="ui-icon ui-icon-trash" onclick="trashDialog.show()" type="button" disabled="#{cc.attrs.controller.selected.id == null}"/>
                </h:panelGroup>
            </f:facet>

            <c:insertChildren/>

        </p:dataTable>

        <h:panelGroup id="editDialog">
            <p:dialog modal="true" widgetVar="editDialog" showEffect="fold" hideEffect="puff"> 

                <f:facet name="header">
                    <h:outputText value="#{bundle['create']}" rendered="#{cc.attrs.controller.selected.id == null}"/>
                    <h:outputText value="#{bundle['update']}" rendered="#{cc.attrs.controller.selected.id != null}"/>
                </f:facet> 

                <h:panelGroup layout="block">

                    <c:renderFacet name="fields"/>

                    <br/>

                    <p:commandButton value="#{bundle['create']}" actionListener="#{cc.attrs.controller.create}" process="editDialog" update="table" oncomplete="closeDialog(xhr, status, args, editDialog)" rendered="#{cc.attrs.controller.selected.id == null}"/>
                    <p:commandButton value="#{bundle['update']}" actionListener="#{cc.attrs.controller.update}" process="editDialog" update="table" oncomplete="closeDialog(xhr, status, args, editDialog)" rendered="#{cc.attrs.controller.selected.id != null}"/>
                    <p:commandButton value="#{bundle['copy']}" actionListener="#{cc.attrs.controller.create}" process="editDialog" update="table" oncomplete="closeDialog(xhr, status, args, editDialog)" rendered="#{cc.attrs.controller.selected.id != null}">
                        <f:setPropertyActionListener target="#{cc.attrs.controller.selected.id}" value="#{null}"/>
                    </p:commandButton>
                </h:panelGroup>

            </p:dialog>

        </h:panelGroup>

        <p:dialog modal="true" header="asdasd" widgetVar="trashDialog" hideEffect="explode" showEffect="explode"> 
            <h:panelGroup id="trashDialog" layout="block">
                <h:outputText value="#{bundle['trashconfirm']}">
                    <f:param name="name" value="#{cc.attrs.controller.selected.name}"/>
                </h:outputText>
            </h:panelGroup>

            <p:commandButton value="#{bundle['confirm']}" actionListener="#{cc.attrs.controller.destroy}" process="@this" update="table" oncomplete="closeDialog(xhr, status, args, trashDialog)"/>
        </p:dialog>
    </c:implementation>
</html>

called by this page test.xhtml:

<html xmlns="http://www.w3.org/1999/xhtml"
        xmlns:ui="http://java.sun.com/jsf/facelets"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:p="http://primefaces.org/ui"
        xmlns:f="http://java.sun.com/jsf/core"
        xmlns:cc="http://java.sun.com/jsf/composite/components">


    <h:head>
        <title>Default Title</title>
        <h:outputStylesheet name="css/screen.css"/>
        <h:outputScript name="js/common.js"/>
    </h:head>

    <h:body>

        <p:growl id="messages" autoUpdate="true"/>

        <h:form id="itemForm">

            <cc:crud id="itemCrud" controller="#{itemController}">

                <f:facet name="fields">
                    <h:panelGrid columns="3">
                        <h:outputLabel value="manufacturer" for="manufacturer"/>
                        <p:selectOneMenu id="manufacturer" value="#{itemController.selected.manufacturer}" converter="#{manufacturerController.converter}">
                            <f:selectItems value="#{manufacturerController.facade.findAll()}" var="e" itemLabel="#{e.title}" itemValue="#{e}"/>
                        </p:selectOneMenu>
                        <p:message for="manufacturer"/>

                        <h:outputLabel value="partNumber" for="partNumber"/>
                        <p:inputText id="partNumber" value="#{itemController.selected.partNumber}"/>
                        <p:message for="partNumber"/>

                        <h:outputLabel value="configurationIndex" for="configurationIndex"/>
                        <p:inputText id="configurationIndex" value="#{itemController.selected.configurationIndex}"/>
                        <p:message for="configurationIndex"/>
                    </h:panelGrid>
                </f:facet>

                <p:column headerText="#{bundle['manufacturer']}" filterBy="#{unit.manufacturer.title}" sortBy="#{unit.manufacturer.title}">
                    #{unit.manufacturer.title}
                </p:column>

                <p:column headerText="#{bundle['partNumber']}" filterBy="#{unit.partNumber}" sortBy="#{unit.partNumber}">
                    #{unit.partNumber}
                </p:column>

                <p:column headerText="#{bundle['configurationIndex']}" filterBy="#{unit.configurationIndex}" sortBy="#{unit.configurationIndex}">
                    #{unit.configurationIndex}
                </p:column>

                <p:column headerText="#{bundle['modifyStatus']}" filterBy="#{unit.modifyStatus}" sortBy="#{unit.modifyStatus}">
                    #{unit.modifyStatus}
                </p:column>

                <p:column headerText="#{bundle['description']}" filterBy="#{unit.description}" sortBy="#{unit.description}">
                    #{unit.description}
                </p:column>

            </cc:crud>

        </h:form>
    </h:body>
</html>

And I have this output:

AVVERTENZA: PWC4011: Unable to set request character encoding to UTF-8 from context /epcsdb, because request parameters have already been read, or ServletRequest.getReader() has already been called
INFO: Skipping call to libraryExists().  Please set context-param com.sun.faces.enableMissingResourceLibraryDetection to true to verify if library http://java.sun.com/jsf/composite/components actually exists
INFO: Cannot find component with identifier "itemForm:itemCrud:table:newButton" in view.
INFO: Cannot find component with identifier "itemForm:itemCrud" in view.
INFO: Cannot find component with identifier "editDialog" in view.
INFO: Cannot find component with identifier "trashDialog" in view.
INFO: Cannot find component with identifier "itemForm:itemCrud:j_idt34" in view.

Result of this is that no component is updated with any ajax call. I don't understand why "itemForm:itemCrud:table:newButton" cannot be found. It is only referenced with process="@this".

I'm using primefaces 3.0.RC1-SNAPSHOT and Mojarra 2.1.3_01.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

You need to prefix absolute client IDs with the NamingContainer separator which is by default :.

update=":#{cc.clientId}"

See also:


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...