jquery.multi-autocomplete.js 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. /**
  2. * Inspired by http://jqueryui.com/demos/autocomplete/#multiple
  3. */
  4. (function( $ ) {
  5. $.widget('ui.multiple_autocomplete', {
  6. _create: function() {
  7. var self = this;
  8. function split( val ) {
  9. return val.split( /,\s*/ );
  10. }
  11. function extractLast( term ) {
  12. return split( term ).pop();
  13. }
  14. function showOptions() {
  15. if(!self.element.autocomplete('widget').is(':visible') && self.element.val().trim() == '') {
  16. self.element.autocomplete('search', '');
  17. }
  18. }
  19. //console.log('_create: ' + this.options['id']);
  20. this.element.bind('click', function( event ) {
  21. showOptions();
  22. });
  23. this.element.bind('input', function( event ) {
  24. showOptions();
  25. });
  26. this.element.bind('blur', function( event ) {
  27. var tmp = self.element.val().trim();
  28. if(tmp[tmp.length-1] == ',') {
  29. self.element.val(tmp.substring(0, tmp.length-1));
  30. } else {
  31. self.element.val(tmp);
  32. }
  33. if(self.element.val().trim() != '') {
  34. self.element.trigger('change'); // Changes wasn't saved when only using the dropdown.
  35. }
  36. });
  37. this.element.bind( "keydown", function( event ) {
  38. if ( event.keyCode === $.ui.keyCode.TAB &&
  39. $( this ).data( "autocomplete" ).menu.active ) {
  40. event.preventDefault();
  41. }
  42. })
  43. .autocomplete({
  44. minLength: 0,
  45. source: function( request, response ) {
  46. // delegate back to autocomplete, but extract the last term
  47. response( $.ui.autocomplete.filter(
  48. self.options.source, extractLast( request.term ) ) );
  49. },
  50. focus: function() {
  51. // prevent value inserted on focus
  52. return false;
  53. },
  54. select: function( event, ui ) {
  55. var terms = split( this.value );
  56. // remove the current input
  57. terms.pop();
  58. // add the selected item
  59. terms.push( ui.item.value );
  60. // add placeholder to get the comma-and-space at the end
  61. terms.push( "" );
  62. this.value = terms.join( ", " );
  63. return false;
  64. }
  65. });
  66. /*this.button = $( "<button type='button'>&nbsp;</button>" )
  67. .attr( "tabIndex", -1 )
  68. .attr( "title", "Show All Items" )
  69. .insertAfter( this.element )
  70. .addClass('svg')
  71. .addClass('action')
  72. .addClass('combo-button')
  73. .click(function() {
  74. // close if already visible
  75. if ( self.element.autocomplete( "widget" ).is( ":visible" ) ) {
  76. self.element.autocomplete( "close" );
  77. return;
  78. }
  79. // work around a bug (likely same cause as #5265)
  80. $( this ).blur();
  81. var tmp = self.element.val().trim();
  82. if(tmp[tmp.length-1] != ',') {
  83. self.element.val(tmp+', ');
  84. }
  85. // pass empty string as value to search for, displaying all results
  86. self.element.autocomplete( "search", "" );
  87. self.element.focus();
  88. });*/
  89. },
  90. });
  91. })( jQuery );