change

Fired when the value of the ProgressBar has changed. If the progress animation is enabled, the event will be fired after the animation has completed (does not applies to chunk ProgressBar).

Event Data

e.value Number

The current value of the ProgressBar.

Example - subscribe to the "change" event during initialization

<button id="set">Set Value to 50</button>
<div id="progressbar"></div>
<script>
  $("#progressbar").kendoProgressBar({
    change: function(e) {
      kendo.alert("Value is " + e.value);
    }
  });

  $("#set").on("click", () => {
    $("#progressbar").data("kendoProgressBar").value(50);
  });
</script>

Example - subscribe to the "change" event after initialization

<button id="set">Set Value to 50</button>
<div id="progressbar"></div>
<script>
  function onChange(e) {
    kendo.alert("Value is " + e.value);
  }

  $("#progressbar").kendoProgressBar();

  var progressbar = $("#progressbar").data("kendoProgressBar");
  progressbar.bind("change", onChange);

  $("#set").on("click", () => {
    $("#progressbar").data("kendoProgressBar").value(50);
  });
</script>
In this article