Sets the value of the Progress bar to indeterminate state(null) and starts the animation.

Code examples

Set the indeterminate property.

 let progressBar = document.querySelector('jqx-progress-bar');

 progressBar.indeterminate = false;

Get the indeterminate property.

 let progressBar = document.querySelector('jqx-progress-bar');

 let indeterminate = progressBar.indeterminate;

Sets the filling direction of the Progress Bar.

Code examples

Set the inverted property.

 let progressBar = document.querySelector('jqx-progress-bar');

 progressBar.inverted = false;

Get the inverted property.

 let progressBar = document.querySelector('jqx-progress-bar');

 let inverted = progressBar.inverted;

A callback function defining the new format for the label of the Progress Bar.

Code examples

Set the formatFunction property.

 let progressBar = document.querySelector('jqx-progress-bar');

 progressBar.formatFunction = function(value) { return "$" + value };

Get the formatFunction property.

 let progressBar = document.querySelector('jqx-progress-bar');

 let formatFunction = progressBar.formatFunction;

Sets progress bars maximum possible value.

Code examples

Set the max property.

 let progressBar = document.querySelector('jqx-progress-bar');

 progressBar.max = 50;

Get the max property.

 let progressBar = document.querySelector('jqx-progress-bar');

 let max = progressBar.max;

Sets progress bars minimum possible value.

Code examples

Set the min property.

 let progressBar = document.querySelector('jqx-progress-bar');

 progressBar.min = 10;

Get the min property.

 let progressBar = document.querySelector('jqx-progress-bar');

 let min = progressBar.min;

Sets the orientation of the progress bar Possible values: 'horizontal', 'vertical'.

Code examples

Set the orientation property.

 let progressBar = document.querySelector('jqx-progress-bar');

 progressBar.orientation = 'vertical';

Get the orientation property.

 let progressBar = document.querySelector('jqx-progress-bar');

 let orientation = progressBar.orientation;

Enables/Disabled the label for the Progress Bar.

Code examples

Set the showProgressValue property.

 let progressBar = document.querySelector('jqx-progress-bar');

 progressBar.showProgressValue = false;

Get the showProgressValue property.

 let progressBar = document.querySelector('jqx-progress-bar');

 let showProgressValue = progressBar.showProgressValue;

Sets/Gets the value of the progress bar

Code examples

Set the value property.

 let progressBar = document.querySelector('jqx-progress-bar');

 progressBar.value = 45;

Get the value property.

 let progressBar = document.querySelector('jqx-progress-bar');

 let value = progressBar.value;

This event is triggered when the value is changed.

Code examples

Bind to the change event by type: jqxProgressBar

 let progressBar = document.querySelector('jqx-progress-bar'); 

 progressBar.addEventListener('change', function (event) {
     // event handling code goes here.
 }