I'm new to JSF and I'm trying to understand more by examples in books and online. That's actually how I easily learn things instead of just reading. So, examples works best for me.
I am trying to understand the exact sequence of what's happening in this code example I saw on one of the video tutorials. To be specific, the f:ajax execution and the listener attribute
<h:form enctype="multipart/form-data">
<h:inputFile value="#{uploadController.image}">
<f:passThroughAttribute name="accept" value="image/png"/>
<f:ajax event="change" listener="#{uploadController.doUpload()}" execute="@form" render="@form"/>
</h:inputFile>
</h:form>
I'm trying to understand the step by step order of execution. So the way I understand this is
1. f:ajax event - listens to any changes that may occur on the h:inputFile component whose value is binded to a Java ManagedBean class and initially has a null value and gets set once the user/client selects and image file. (so from initial value of null, null value is replaced with the file chosen by the client.
2. execute="@form" - sends or posts all the components(such as h:inputFile, h:inputText etc) values contained in the h:form
3. Everytime the h:inputFile value is changed(either from null or another file is selected), the #{uploadController.doUpload()} EL expression is triggered which results to calling the doUpload() method which automatically uploads the file.
4. Lastly, render="@form" updates the look and values of forms (not really sure about what exactly happens in render="@form"
Am I correct with my understanding of what exactly this f:ajax tag and its attributes does?
I'm asking this because I know that incorporating f:ajax with jsf will improve the performance of a web application as it only updates or renders partials or parts of the page and gives the advantage of not having to reload the entire page.
