I'm using primefacas fileUpload with simple mode(not using advanced mode due to some other reasons). I use style="display:none" to make the fileUpload "hidden", then add in a inputText with a commandbutton to represent the fileUpload(because by this way I can do the design easier).
I use javascript to call the p:fileUpload when user click on p:commandbutton(Browse)
and update the chosen file path to the inputText.
When I submit the form, it working nice in firefox and chrome, but need press two times only work in IE. Anyone know how to solve it?
xhtml page
<h:form enctype="multipart/form-data" id="formUpload">
<p:messages globalOnly="true" />
<div style="display:none">
<p:fileUpload value="#{testingBean.file}" mode="simple" id="file"/>
</div>
<p:inputText id="txtFile" />
<p:commandButton type="button" value="Browse" onclick="browseAndUpdate()" />
<p:remoteCommand name="browseAndUpdate" update="@form" onstart="document.getElementById('formUpload:file').click()" />
<p:commandButton value="Submit" ajax="false" action="#{testingBean.upload}"/>
</h:form>
<script>
$("input[name='formUpload:file']").change(function() {
$("input[name='formUpload:txtFile']").val($(this).val());
});
</script>
backing bean
private UploadedFile file;
public UploadedFile getFile() {
return file;
}
public void setFile(UploadedFile file) {
this.file = file;
}
public void upload() {
UploadedFile f = this.getFile();
if (null == f) {
FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("null", " null"));
} else {
FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("Succesful", f.getFileName() + " uploaded."));
}
}
Edit:
I refer to BalusC's post commandButton/commandLink/ajax action/listener method not invoked or input value not updated and believe that my issue is his point 7.
After browser a file, I try to update the form with p:remoteCommand, the form is update and the upload button able to submit by the first click, but the chosen file was gone become null.
I have no idea how to update the fileUpload viewState..anyone can help?
Besides this, I refer another BalusC's answer h:commandButton/h:commandLink does not work on first click, works only on second click, but I do not know need to put those javascript to where, @BalusC can you guid me a bit? thanks a lot..