StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>If you want to trigger the search when a button is clicked, then you have to call the search method. If you want to show all options, call search with the value set to empty string and set the autocomplete widget to accept minLength: 0. </p> <p>So in code:</p> <p>UI</p> <pre><code><div class="ui-widget"> <label for="birds">Birds: </label> <input id="birds" size="50" /> <input type="button" id="search-trigger" value="Trigger" /> </div> </code></pre> <p>Script</p> <pre><code><script type="text/javascript"> $(function() { function split( val ) { return val.split( /,\s*/ ); } function extractLast( term ) { return split( term ).pop(); } // Button listener that triggs the search event $("#search-trigger").click(function(){ var searchTerm = $( "#birds" ).val(); $( "#birds" ).autocomplete( "search" , searchTerm); }); $( "#birds" ) .bind( "keydown", function( event ) { if ( event.keyCode === $.ui.keyCode.TAB && $( this ).data( "autocomplete" ).menu.active ) { event.preventDefault(); } }) .autocomplete({ source: ["lorem", "ipsum", "dolor"], /* Commented this out to use dummy data above function( request, response ) { $.getJSON( "search.php", { term: extractLast( request.term ) }, response ); },*/ search: function() { var term = extractLast( this.value ); /* What is this check for? if ( term.length < 2 ) { return false; }*/ }, focus: function() { return false; }, select: function( event, ui ) { var terms = split( this.value ); terms.pop(); terms.push( ui.item.value ); terms.push( "" ); this.value = terms.join( ", " ); return false; }, //Added for "show all" support minLength: 0 }); }); </script> </code></pre> <p>Is this the behavior you are looking for?</p> <p>Ref: <a href="http://jqueryui.com/demos/autocomplete/#method-search" rel="nofollow">http://jqueryui.com/demos/autocomplete/#method-search</a></p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload