JSFiddle - React, Tailwind, and code Playground

by s4ty

HTML

<form method="post" id="customer">
  <label for="agency">Agentur</label>
  <input type="text" name="agency" id="agency" value="" class="autocomplete wide" />
</form>

JavaScript

trigger_modal={
  init: function(){
    $('img.pClick').on('click',function(){
      var url = $(this).data('url');
      var options = {width: $(this).data('width'), height: $(this).data('height'), modal: true};
      $('div#modal').load(url).dialog(options);
    });
  }
};
trigger_complete={
  init:function(){
    var type = $('#customer #agency').data('type');
    var cache = {}, lastXhr;
    $('#customer #agency').autocomplete({
      minLength: 3,
      source: function(request,response){
        var term = request.term;
        if (term in cache) {
          response(cache[term]);
          return;
        }
         console.log(term);
        lastXhr = $.getJSON('/ajax.php?do=search&type='+type, request, function(data,status,xhr){
          cache[term] = data;
          if (xhr===lastXhr) {response(data);}
        });
      }
    });
  }
};
$(document).ready(function(){
  trigger_modal.init();
  trigger_complete.init();
});