The Start and Stop buttons below the progress bar are plain JSF buttons that control the bar through their onclick events see Listing 3. Notice that the button's type is set to button instead of the default, submit.
The resetPB function uses zero, whereas, in the advancePB call, you first get the current state pb. After you have done this, you need to update the manual progress bar on the screen by using the redraw call. In the next section, you'll see more realistic examples. Using an automatic progress bar for a long-running, server-side task Open the auto. This page has a button that initiates a time-consuming action on the server. When the user clicks the button, the server waits 10 seconds before responding to the browser.
In a real-world application, the server may be busy querying a database, computing a route, or performing some similar task that takes a while to complete. Even though you don't know how long it will take the server to respond, you can let the user know that the task is running and that the user should wait.
One way to do so is to show an automatic progress bar that will run until the server responds and the page gets refreshed.
Such a scenario can often be found on the pages that ask a user to perform a number of operations or steps, such as filling out a large form or taking a test.
As an example, the manual. As soon as one of the answers is modified, the progress bar is updated to reflect how many answers were correct and to show overall progress.
To build this page, you use a ProgressBar component in manual mode, similar to the one used on the basic. You can see the result in Figure 4. Manual mode after update View image at full size Monitoring progress of a server-side task by using Ajax In the earlier example auto.
Therefore, it was appropriate to use an automatic ProgressBar, and it just kept running until the server finished processing the task. For example, you could be processing a database row by row, and you know how many rows there are and how many have already been processed. In such a case, it would be useful if the progress bar in the browser could be updated according to the server-side status, rather than running blindly.
First, you need to add a ProgressBar component, using the code that you see in Listing This may not be obvious at first -- after all, you are not really going to update it manually every time.
Every time the browser sends an Ajax request to the server, the get method for the pbValue property will be executed and whatever value it returns will be put into the hidden input field in the browser. In the sample application, the get method for pbValue simply keeps a counter in the session and increments it every time the get method is called. There is also a Reset button on the page that resets the counter to zero.
That click sends the Ajax request to the server, the server returns current progress status, and the hidden field is updated.
Main ProgressBar attributes Attribute.