Advertisement
ak47suk1

jquery autocomplete combobox option value set to empty

Dec 29th, 2011
380
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
jQuery 4.60 KB | None | 0 0
  1.     (function( $ ) {
  2.         $.widget( "ui.combobox", {
  3.             _create: function() {
  4.                 var self = this,
  5.                     select = this.element.hide(),
  6.                     selected = select.children( ":selected" ),
  7.                     value = selected.val() ? selected.text() : "";
  8.                 var input = this.input = $( "<input>" )
  9.                     .insertAfter( select )
  10.                     .val( value )
  11.                     .autocomplete({
  12.                         delay: 0,
  13.                         minLength: 0,
  14.                         source: function( request, response ) {
  15.                             var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" );
  16.  
  17.                             var select_el = select.get(0); // get dom element
  18. var rep = new Array(); // response array
  19.  var maxRepSize = 25; // maximum response size  
  20.     // simple loop for the options
  21.     for (var i = 0; i < select_el.length; i++) {
  22.         var text = select_el.options[i].text;
  23.         if ( select_el.options[i].value && ( !request.term || matcher.test(text) ) )
  24.             // add element to result array
  25.             rep.push({
  26.                 label: text, // no more bold
  27.                 value: text,
  28.                 option: select_el.options[i]
  29.             });
  30.            
  31.             if ( rep.length > maxRepSize ) {
  32.             rep.push({
  33.                 label: "... more available",
  34.                 value: "maxRepSizeReached",
  35.                 option: ""
  36.             });
  37.             break;
  38. }
  39.            
  40.     }
  41.     // send response
  42.     response( rep );
  43.  
  44.  
  45.                             // response( select.children( "option" ).map(function() {
  46.                                 // var text = $( this ).text();
  47.                                 // if ( this.value && ( !request.term || matcher.test(text) ) )
  48.                                     // return {
  49.                                         // label: text.replace(
  50.                                             // new RegExp(
  51.                                                 // "(?![^&;]+;)(?!<[^<>]*)(" +
  52.                                                 // $.ui.autocomplete.escapeRegex(request.term) +
  53.                                                 // ")(?![^<>]*>)(?![^&;]+;)", "gi"
  54.                                             // ), "<strong>$1</strong>" ),
  55.                                         // value: text,
  56.                                         // option: this
  57.                                     // };
  58.                             // }) );
  59.                         },
  60.                         select: function( event, ui ) {
  61.                        
  62.                         if ( ui.item.value == "maxRepSizeReached") {
  63.         //return false;
  64.     }
  65.                         else {
  66.                             ui.item.option.selected = true;
  67.                             self._trigger( "selected", event, {
  68.                                 item: ui.item.option
  69.                             });
  70.                             }
  71.                         },
  72.                        
  73.                         // focus: function( event, ui ) {
  74.     // if ( ui.item.value == "maxRepSizeReached") {
  75.         // return false;
  76.     // }
  77. // },
  78.  
  79.                        
  80.                         change: function( event, ui ) {
  81.                             if ( !ui.item ) {
  82.                                 var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( $(this).val() ) + "$", "i" ),
  83.                                     valid = false;
  84.                                 select.children( "option" ).each(function() {
  85.                                     if ( $( this ).text().match( matcher ) ) {
  86.                                         this.selected = valid = true;
  87.                                         return false;
  88.                                     }
  89.                                 });
  90.                                 if ( !valid ) {
  91.                                     // remove invalid value, as it didn't match anything
  92.                                     $( this ).val( "" );
  93.                                     select.val( "" );
  94.                                     input.data( "autocomplete" ).term = "";
  95.                                     //return false;
  96.                                 }
  97.                             }
  98.                         }
  99.                     })
  100.                     .addClass( "ui-widget ui-widget-content ui-corner-left" );
  101.                     var span = $("<span style=\" white-space: nowrap;\"></span>")
  102.       .append(input).insertAfter( select );
  103.  
  104.                 input.data( "autocomplete" )._renderItem = function( ul, item ) {
  105.                     return $( "<li></li>" )
  106.                         .data( "item.autocomplete", item )
  107.                         .append( "<a>" + item.label + "</a>" )
  108.                         .appendTo( ul );
  109.                 };
  110.  
  111.                 this.button = $( "<button type='button'>&nbsp;</button>" )
  112.                     .attr( "tabIndex", -1 )
  113.                     .attr( "title", "Show All Items" )
  114.                     .insertAfter( input )
  115.                     .button({
  116.                         icons: {
  117.                             primary: "ui-icon-triangle-1-s"
  118.                         },
  119.                         text: false
  120.                     })
  121.                     .removeClass( "ui-corner-all" )
  122.                     .addClass( "ui-corner-right ui-button-icon" )
  123.                     .click(function() {
  124.                         // close if already visible
  125.                         if ( input.autocomplete( "widget" ).is( ":visible" ) ) {
  126.                             input.autocomplete( "close" );
  127.                             return false;
  128.                         }
  129.  
  130.                         // work around a bug (likely same cause as #5265)
  131.                         $( this ).blur();
  132.  
  133.                         // pass empty string as value to search for, displaying all results
  134.                         input.autocomplete( "search", "" );
  135.                         input.focus();
  136.                         //return false;
  137.                     });
  138.             },
  139.  
  140.             destroy: function() {
  141.                 this.input.remove();
  142.                 this.button.remove();
  143.                 this.element.show();
  144.                 $.Widget.prototype.destroy.call( this );
  145.             }
  146.         });
  147.        
  148.        
  149.        
  150.        
  151.     })( jQuery );
  152.  
  153.     $(document).ready(function() {
  154.         $( "#userid"  ).combobox({
  155.         });
  156.         $( "#facid"  ).combobox({
  157.         });
  158.         $('input.ui-autocomplete-input').val("");
  159.         $( "#tabstats" ).tabs().find( ".ui-tabs-nav" ).sortable({ axis: "x" });
  160.        
  161.  
  162.        
  163.     });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement