JPList tips

How to improve the JPList textbox search experience?

When using a JPList textbox searchbox we advise you to improve the autocomplete experience by following these steps:

Add data-event-name="keydelay" attribute to input tag
Add "textfilter" class to input tag
Load the example javascript, on document ready, that you find here

<input data-path=".title" class="form-control textfilter"
        type="text"
        value=""
        placeholder="Filter by Title"
        data-control-type="textbox"
        data-control-name="Title"
        data-control-action="filter"
        data-event-name="keydelay"       />

var isTyping = false;
var typingHandler = null;
var $textfilter = $(".textfilter", this);

$textfilter.on('input', function(context){
  if (isTyping) {
    window.clearTimeout(typingHandler);
  }
  else {
    isTyping = true;
  }

  typingHandler = window.setTimeout(function () {
    isTyping = false;
    $textfilter.trigger("keydelay");
  }, 1000);
});