jQuery UI Progressbar
Progressbar specifies the completion percentage of an operation or progress.
Progressbar can be categorized in two types:
- Determinate progressbar
- Indeterminate progressbar
Determinate Progressbar:
Determinate progress bar is only used in situation where the system can accurately update the current status. The determinate progress bar should never fill from left to right, then loop back to empty for a single process.
Indeterminate Progressbar:
The Indeterminate progressbar is used to provide user feedback.
Syntax:
You can use the progressbar() method in two forms:
First Method
The progressbar (options) method specifies that an HTML element can be managed in the form of a progress bar. Here the “options” parameter is an object that specifies the appearance and behavior of progress bars.
Syntax:
You can use one or more options at a time using JavaScript object. In the case of more than one options, you have to separate them using a comma as follows:
Following is a list of different options that can be used with this method.
| Option | Description |
|---|---|
| disabled | If you set this option to true then it disables the progress bars. By default its value is false. |
| max | This option is used to set the maximum value for a progress bar. By default its value is 100. |
| value | This option specifies the initial value of the progress bar. By default its value is 0. |
Example of jQueryUI Progressbar() method:
Let’s take a simple example to demonstrate the functionality of progress bar passing no parameter to the progressbar() method.