Pass value of another input component when uploading file via p:fileUpload mode=advanced

Question

i have a the add the primefaces fileupload.

<h:form id="form" enctype="multipart/form-data">    
<h:selectOneMenu id="Collection" value="#{imputData.collList.currentColl}">
<f:selectItems value="#{imputData.collList.collList}" />
</h:selectOneMenu>      
<p:fileUpload id="fileUpload" label="Durchsuchen" uploadLabel="Upload" cancelLabel="zurück" fileUploadListener="#{imputData.handleFileUpload}" mode="advanced" dragDropSupport="true" update="Collection,messages" sizeLimit="100000" allowTypes="/(\.|\/)(txt|cvs)$/" />  

 <p:growl id="messages" showDetail="true"/>             
<h:commandButton id="read" action="#{imputData.imput}" value="#{msgs.read}"/>

</h:form>

It looks like this

I have two question. How can i made the Fileupload smaller. Mean not wide over the hole page?

To get the name from the selectOneMenu i must klick on the read-button (Lesen). If i klick und the upload-button i get no information from the SelectOneMenu (null). Must i write ajax="true" in the <p:fileUpload.. or something to get the Information from selectOneMenu in the upload-Button?

i write the Id from the Collection in the update of fileUpload update="Collection,messages" but it doesn't slove my problem.

Answer 1

You can use the onstart of the fileUpload, which would call a remoteCommand to process your selectOneMenu and save it as property of the same bean which must be view scoped.

<p:fileUpload id="fileUpload" mode="advanced" onstart="submitCollection()" />

<p:remoteCommand name="submitCollection" process="@this Collection" />

As for the width of the fileUpload, you can use the following css:

.ui-fileupload {
   width: 400px;//change the px into what fits you
}

Hope this helps.