Databases
StackOverflow2013
Postsdbo
POAutocomplete with multiple values
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POAutocomplete with multiple values
    text
    copied!<p>I have tried out the jQuery autocomplete for multiple values. It works fine but the only problem is that if I enter a word in the textarea then go to the begining of the textarea and enter another word it appends to the end of the text area and not at the CARET position.Could you please help?</p> <p>Thank You</p> <p>This is the Code:</p> <pre><code> &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org /TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /&gt; &lt;script type="text/javascript"&gt; // document.domain = "toitl.com"; // alert(document.domain); &lt;/script&gt; &lt;title&gt;Form Field Clear&lt;/title&gt; &lt;link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery- ui.css" rel="stylesheet" type="text/css"/&gt; &lt;script type="text/javascript" src='../../../../libuser/toitldocumentdomain.js'&gt; &lt;/script&gt; &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"&gt;&lt;/script&gt; &lt;script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.js"&gt;&lt;/script&gt; &lt;meta charset="utf-8"&gt; &lt;script&gt; $(function() { var availableTags = [ "ActionScript", "AppleScript", "Asp", "BASIC", "C", "C++", "Clojure", "COBOL", "ColdFusion", "Erlang", "Fortran", "Groovy", "Haskell", "Java", "JavaScript", "Lisp", "Perl", "PHP", "Python", "Ruby", "Scala", "Scheme" ]; function split( val ) { return val.split( / \s*/ ); } function extractLast( term ) { return split( term ).pop(); } $( "#tags" ) // 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({ minLength: 0, source: function( request, response ) { response( $.ui.autocomplete.filter( availableTags, extractLast( request.term ) ) ); }, 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 ); terms.push( "" ); this.value = terms.join( " " ); return false; } }); }); &lt;/script&gt; &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div class="demo"&gt; &lt;div class="ui-widget"&gt; &lt;label for="tags"&gt;Tag programming languages: &lt;/label&gt; &lt;textarea id="tags" cols="50" &gt;&lt;/textarea&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
 

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