refresh widgets in different forms, possible?

UI Components for JSF
Post Reply
greyelf99
Posts: 20
Joined: 06 Aug 2011, 09:25

28 Sep 2011, 11:48

Hi, ok so I used to have an interface all in one form and am trying to convert it to a more sophisiticated layout. I now have 4 layoutUnits in the page, each has its own form. The idea is to do something in each layoutunit (except the first one) then move on to the next one, like steps.

My main problem is after uploading files in the third layoutUnit I can't update the h:selectOneListbox values in the last layoutUnit. When the page loads the listbox is empty, but when files are uploaded the listbox method #{uploadMethod.listValue} would theoretically return some values to display in the listbox - I just can't get that method to run and refresh the listBox again. I've tried merging those two layoutunits into a single form then refreshing the page after uploading files to update the listbox, with no success.

Is there a way to have a button in layoutunit 3 that refreshes the listbox in layoutunit 4? My other issue is I want to extend this to having a commandButton in each layout that enabled the widgets in the next layout when clicked. Unless of course widgets in separate forms simply don't interact this way, which I'm suspecting.

Sorry for the long post, any obvious tips would be appreciated, I'm fairly new to JSF+PF

Code: Select all

  <p:layout fullPage="true">  
        <p:layoutUnit position="top" height="75" header="DQ System - Add Method" >  
            <p:button value="Main Menu" outcome="index" />
            <p:button value="Browse" outcome="managedata" />
            <p:button value="Help" outcome="managedata" />
        </p:layoutUnit>  

        <p:layoutUnit position="left" width="400" header="Step 1: New Method Name" resizable="true" >  
            <h:form>
                <br />
                <br />
                <p:panel header="Select Existing Data Method Category" >  
                    <h:outputText value="You can select an existing data method category to put your new method in, or create a new category by typing it's name in the next section below." />
                    <br />
                    <h:selectOneListbox value="#{uploadMethod.methodType}" id="methodtypelist" size="5">
                        <f:selectItems value="#{uploadMethod.typeValue}" var="typ" itemLabel="#{typ.typeLabel}" itemValue="#{typ.typeValue}" />
                        <f:ajax event="change" execute="@this" />
                    </h:selectOneListbox>
                </p:panel>
                <br />
                <p:panel header="Create New Data Method Category" >
                    <h:outputText value="If you are creating a new category of methods enter the category name here." />
                    <br />
                    <p:inputText value="#{uploadMethod.typeName}" size="40" >
                        <f:ajax event="change" execute="@this" />
                    </p:inputText>
                </p:panel>
                <br />
                <p:panel header="Enter Name of Method" >
                    <h:outputText value="Give your method a unique and meaningful name. We suggest you include the method desciption and well as your initials and a date." />
                    <br />
                    <p:inputText value="#{uploadMethod.methodName}" size="40" >
                        <f:ajax event="change" execute="@this" />
                    </p:inputText>                
                </p:panel>
                <p:commandButton value="Continue" action="submit" />
            </h:form>
        </p:layoutUnit>

        <p:layoutUnit position="center" header="Step 2: Select Method Files To Upload">  
            <h:form>
                <br />
                <br />
                <p:panel header="Select File(s)" >
                    <h:outputText value="Select the class files used in your method. If all files are in the same directory simply select them all. For more complex programs that include subdirectories zip all contents in the package root directory then upload the .zip file." />
                    <br />
                    <p:growl id="messages" showSummary="true" showDetail="true" />  
                    <p:fileUpload fileUploadListener="#{uploadMethod.handleFileUpload}" 
                        update="messages"  sizeLimit="1048576"
                        multiple="true" label="Select Files" allowTypes="*.java;*.zip;" 
                        description="Source files">
                    </p:fileUpload>
                </p:panel>
                <p:commandButton value="Continue" actionListener="#{uploadMethod.getListValue}" action="submit" />
            </h:form>
        </p:layoutUnit>  

        <p:layoutUnit position="right" width="400" header="Step 3: Select Main Run Class" resizable="true" >  
            <h:form>
                <br />
                <br />
                <p:panel header="Select Main Class to Run" >
                    <h:outputText value="Select the uploaded class that will be called to start up your method." />
                    <br />
                    <h:selectOneListbox value="#{uploadMethod.mainFile}" id="filelist" size="5">
                        <f:selectItems value="#{uploadMethod.listValue}" var="lst" itemLabel="#{lst.listLabel}" itemValue="#{lst.listValue}" />
                    </h:selectOneListbox>
                    <br />
                    <p:commandButton value="Show Classes" action="refresh" >
                        <f:ajax event="change" execute="@this" render="filelist" />
                    </p:commandButton>
                    <p:commandButton value="Select" action="#{uploadMethod.manageUpload}" />
                </p:panel>
            </h:form>
        </p:layoutUnit>  
    </p:layout>
Primefaces 3.4.1 | Glassfish 3.1 | Netbeans 7.0.1 | Mojarra 2.1.3

Matrium
Posts: 112
Joined: 16 May 2011, 08:27

28 Sep 2011, 18:35

i am still not sure what you exactly need, but you can of course update elements within another form
dont' forget to use absolute names if they are inside another naming container like form

example:

Code: Select all

<form id="step1">
		<p:commandButton value="Continue" update="@form step2:filelist"/>
	</form>

	<form id="step2">
		<h:selectOneListbox id="filelist" value="#{uploadMethod.mainFile}"
			size="5">
			<f:selectItems value="#{uploadMethod.listValue}" var="lst"
				itemLabel="#{lst.listLabel}" itemValue="#{lst.listValue}" />
		</h:selectOneListbox>
	</form>
PrimeFaces (Elite) 4.0.13, Majorra 2.1.28, Tomcat 7.0.53
Testing with Firefox, Chrome and IE9+IE10
<3 Primefaces!!!

cagatay.civici
Prime
Posts: 18616
Joined: 05 Jan 2009, 00:21
Location: Cybertron
Contact:

28 Sep 2011, 18:49

Or JSF2 way;

Code: Select all

<p:commandButton value="Continue" update="@form :step2:filelist"/
>

greyelf99
Posts: 20
Joined: 06 Aug 2011, 09:25

29 Sep 2011, 02:46

Thanks both of you, very helpful trick to know!
Primefaces 3.4.1 | Glassfish 3.1 | Netbeans 7.0.1 | Mojarra 2.1.3

Post Reply

Return to “PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: Google [Bot] and 35 guests