Autocomplete with multiple values

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?

Thank You

  • Loop through <select> and build array in the format: “value1”,“value2”,“value3”
  • Keyboard up and down arrows
  • autocomplete from php array
  • jQuery autocomplete in Flask
  • How to create autosuggest to get keywords as fast as google search or live search
  • jQuery UI Autocomplete not triggering a search when entering a hitherto searched for term
  • This is the Code:

     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org     
    
         /TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
      <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <script  type="text/javascript"> 
      //         document.domain = "toitl.com"; 
      //         alert(document.domain); 
    </script> 
    <title>Form Field Clear</title> 
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-
    
      ui.css"  
          rel="stylesheet" type="text/css"/> 
    <script type="text/javascript"  src='../../../../libuser/toitldocumentdomain.js'>
    
        </script> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.js"></script> 
      <meta charset="utf-8">
          <script>
    $(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 &&
                        $( 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;
                }
            });
    });
    </script>
    
    
      </script> 
     </head> 
     <body> 
      <div class="demo">
    
      <div class="ui-widget"> 
    <label for="tags">Tag programming languages: </label>
    <textarea id="tags" cols="50" ></textarea>
     </div>
    
     </div>
     </body> 
     </html>
    

  • Prevent Firefox autocompletion from popping up
  • Bypass all cacheing on jQuery.autocomplete(1.02)
  • jQuery UI autocomplete- no results message
  • Using PhantomJS and IntelliSense in VS2015
  • jQuery autocomplete - How to handle extra data?
  • lightweight alternative to jquery-ui autocomplete plugin?