[% USE L %]
[% USE T8 %]
[% USE LxERP %]
[% L.javascript_tag('jquery', 'jquery-ui') %]
<link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.8.12.custom.css" type="text/css" />

<p>Pick a part</p>
id: [% L.input_tag('part_id', '') %]
nr: [% L.input_tag('part_partnumber', '') %]
desc: [% L.input_tag('part_description', '') %]

<script type='text/javascript'>
function autocomplete_part (selector, column, type) {
  $(function(){ $(selector).autocomplete({
    source: function(req, rsp) {
      $.ajax({
        url: 'controller.pl?action=Part/ajax_autocomplete',
        dataType: "json",
        data: {
          column: column,
          term: req.term,
          current: function() { $('#part_id').val() },
          type: type,
          obsolete: 0,
        },
        success: function (data){ rsp(data) }
      });
    },
    limit: 20,
    delay: 50,
    select: function(event, ui) {
      $('#part_id').val(ui.item.id);
      $('#part_partnumber').val(ui.item.partnumber);
      $('#part_description').val(ui.item.description);
    },
  })});
}
autocomplete_part('#part_partnumber', 'partnumber', ['part', 'assembly']);
autocomplete_part('#part_description', 'description', ['part', 'assembly']);
</script>