How to implement binding throttling in Kendo UI?

Question

Could you provide an example of throttling implementation in Kendo UI?

Thanks!

Answer 1

For the Google search record, Kendo UI now includes a built-in throttle method. It can be used to limit the number of calls to a function within a specified time.

Example usage from the Kendo UI docs:

  var throttled = kendo.throttle(function() {
      console.log("hey! " + new Date());
  }, 100);

  // will log two times "hey":
  // (1) once for the first call
  // (2) once for the last call, roughly 100ms after the first one
  for (var i = 0; i < 10; i++) {
      throttled();
  }

Docs: http://docs.telerik.com/kendo-ui/api/javascript/kendo#methods-throttle

Answer 2

You can use the jquery-throttle-debounce library. Here's some snippets of integrating it with Kendo databinding, assuming before you had keyup: updateFromDataSource.

<input id="searchText" type="text" data-value-update="keyup" data-bind="value: searchTextVal, events: { keyup: searchTextKeyed  }"  />

searchTextKeyed: jQuery.debounce(300, function () { this.updateFromDataSource(); }), ...