js/autocomplete_part.js

   1 $(function(){
   2   $('input.part_autocomplete').each(function(i,real){
   3     var $dummy  = $('#' + real.id + '_name');
   4     var $type   = $('#' + real.id + '_type');
   5     var $column = $('#' + real.id + '_column');
   6     $dummy.autocomplete({
   7       source: function(req, rsp) {
   8         $.ajax({
   9           url: 'controller.pl?action=Part/ajax_autocomplete',
  10           dataType: "json",
  11           data: {
  12             term: req.term,
  13             type: function() { return $type.val() },
  14             column: function() { return $column.val()===undefined ? '' : $column.val() },
  15             current: function() { return real.value },
  16             obsolete: 0,
  17           },
  18           success: function (data){ rsp(data) }
  19         });
  20       },
  21       limit: 20,
  22       delay: 50,
  23       select: function(event, ui) {
  24         $(real).val(ui.item.id);
  25         $dummy.val(ui.item.name);
  26       },
  27     });
  28
  29     var open_dialog = function(){
  30       open_jqm_window({
  31         url: 'controller.pl',
  32         data: {
  33           action: 'Part/part_picker_search',
  34           real_id: function() { return $(real).attr('id') },
  35           'filter.all:substr::ilike': function(){ return $dummy.val() },
  36           'filter.type': function(){ return $type.val() },
  37           'column': function(){ return $column.val() },
  38           'real_id': function() { return real.id },
  39         },
  40         id: 'part_selection',
  41       });
  42       return true;
  43     };
  44     /*  In case users are impatient and want to skip ahead:
  45      *  Capture <enter> key events and check if it's a unique hit.
  46      *  If it is, go ahead and assume it was selected. If it wasn't don't do
  47      *  anything so that autocompletion kicks in.  For <tab> don't prevent
  48      *  propagation. It would be nice to catch it, but javascript is too stupid
  49      *  to fire a tab event later on, so we'd have to reimplement the "find
  50      *  next active element in tabindex order and focus it".
  51      */
  52     $dummy.keypress(function(event){
  53       if (event.keyCode == 13 || event.keyCode == 9) { // enter or tab or tab
  54         // if string is empty asume they want to delete
  55         if ($dummy.val() == '') {
  56           $(real).val('');
  57           return true;
  58         }
  59         $.ajax({
  60           url: 'controller.pl?action=Part/ajax_autocomplete',
  61           dataType: "json",
  62           data: {
  63             term: $dummy.val(),
  64             type: function() { return $type.val() },
  65             column: function() { return $column.val()===undefined ? '' : $column.val() },
  66             current: function() { return real.value },
  67             obsolete: 0,
  68           },
  69           success: function (data){
  70             // only one
  71             if (data.length == 1) {
  72               $(real).val(data[0].id);
  73               $dummy.val(data[0].description);
  74               if (event.keyCode == 13)
  75                 $('#update_button').click();
  76             } else {
  77               open_dialog();
  78             }
  79           }
  80         });
  81         if (event.keyCode == 13)
  82           return false;
  83       };
  84     });
  85
  86     $dummy.blur(function(){
  87       if ($dummy.val() == '')
  88         $(real).val('');
  89     });
  90
  91     // now add a picker div after the original input
  92     var pcont  = $('<span>').addClass('position-absolute');
  93     var picker = $('<div>');
  94     $dummy.after(pcont);
  95     pcont.append(picker);
  96     picker.addClass('icon16 CRM--Schnellsuche').click(open_dialog);
  97   });
  98 })