Note that there are some explanatory texts on larger screens.

plurals
  1. POphp, Jquery autocomplete multiple values, remote!
    text
    copied!<p>am new to jquery! I'm using jquery ui autocomplete in my application where the auto complete values comes from database. Here are codes that am using but nothing happens</p> <pre><code>search.php &lt;?php $conn = mysql_connect("localhost", "root", ""); mysql_select_db("webforum", $conn); $q = strtolower($_GET["term"]); $query = mysql_query("select name from groups where name like %$q%"); while ($row = mysql_fetch_array($query)) { echo json_encode($row); } ?&gt; </code></pre> <p>Here is test.php</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt; jQuery UI Autocomplete - Multiple, remote &lt;/title&gt; &lt;link rel="stylesheet" href="theme/jquery.ui.all.css"&gt; &lt;script type="text/javascript" src="jquery/jquery-1.4.4.min.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="jquery/ui/jquery.ui.core.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="jquery/ui/jquery.ui.widget.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="jquery/ui/jquery.ui.position.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="jquery/ui/jquery.ui.autocomplete.js"&gt;&lt;/script&gt; &lt;style type="text/css"&gt; .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; } &lt;/style&gt; &lt;script type="text/javascript"&gt; $(function() { function split( val ) { return val.split( /,\s*/ ); } function extractLast( term ) { return split( term ).pop(); } $( "#birds" ) // don't navigate away from the field on tab when selecting an item .bind( "keydown", function( event ) { if ( event.keyCode === $.ui.keyCode.TAB &amp;&amp; $( this ).data( "autocomplete" ).menu.active ) { event.preventDefault(); } }) .autocomplete({ source: function( request, response ) { $.getJSON( "http://localhost/webforum/search.php", { term: extractLast( request.term ) }, response ); }, search: function() { // custom minLength var term = extractLast( this.value ); if ( term.length &lt; 2 ) { return false; } }, focus: function() { // prevent value inserted on focus return false; }, select: function( event, ui ) { var terms = split( this.value ); // remove the current input terms.pop(); // add the selected item terms.push( ui.item.value ); // add placeholder to get the comma-and-space at the end terms.push( "" ); this.value = terms.join( ", " ); return false; } }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div class="demo"&gt; &lt;div class="ui-widget"&gt; &lt;label for="birds"&gt;Birds: &lt;/label&gt; &lt;input id="birds" size="50" /&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>Can anyone help me with this? Thanx in Advance!</p>
 

Querying!

 
Guidance

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