Comma separated multiple Autocomplete in one field

As there are lot more improvements in the Alloy UI 2.X . Some attributes have been removed and some are replaced for auto complete. So to implement the comma separeted multiple autocomplete in one field in Alloy UI 1.5 there was attribute delimChar: ',' that have been replaced with queryDelimiter : ','

In Liferay 6.2 this functionality can be achieved by using the following AUI script.

 <aui:input name="states" type="textarea" ></aui:input>
  
     <aui:script use="autocomplete-list,aui-base,autocomplete-filters,autocomplete-highlighters"> 
   
        var states = [ 
   
                {"name":"California"}, 
   
                {"name":"Colorado"}, 
   
                {"name":"Connecticut"}, 
   
                {"name":"Colorado"} 
   
                ];  
   
        new A.AutoCompleteList( 
   
            { 
   
             allowBrowserAutocomplete: 'false', 
   
             activateFirstItem: 'true', 
   
             inputNode: '#<portlet:namespace/>states', 
   
             resultTextLocator: 'name', 
   
             resultHighlighter:'phraseMatch', 
   
             resultFilters: ['startsWith'], 
      
             minQueryLength: 2, 
      
             maxResults: 10, 
      
             queryDelimiter : ',', 
      
             render: 'true', 
   
             source:states 
   
        });   
   
     </aui:script>

2 Comments

Please sign in to comment.

Hi Sushil,

I was looking for this in one of the current projects and you exactly gave the solutions. Thank you so much.

Ahamed Hasan
Author, Liferay Cookbook
http://mpowerglobal.com/download-cookbook

Please sign in to reply.

HI .. How to eliminate duplicate item here

Please sign in to reply.

Menu Display

Blogs

Category Filter

More Blog Entries

Liferay Service Builder Custom Service Methods

5 Reasons You Don't Want to Miss the Liferay Symposium North America