Question

During a form compilation i need to be able to insert a value, presenting a list of already used values (usual listbox behavior).
But i also need to be able to enter a new value, so i choosed aui:autocomplete (code below).

By default it allows selection of multiple items separated by the “delimChar” separator.
Is there any way to limit to 1 single value selection (or new value)?

var catArray = new Array();
    <%for (String s : categoryList) {%>
        catArray.push('<%=s%>');
    <%} %>
    var autoCompleteCategory = new A.AutoComplete( 
    { 
        contentBox: '#<portlet:namespace />contactOptions',
        input:'#<portlet:namespace/>category',
        dataSource: catArray, 
        delimChar: ',', 
        typeAhead: true, 
    }).render();

Answer 1

Making comment as the answer for better visibility:

You can remove the attribute delimchar: ',' from the following code:

var catArray = new Array();
    <%for (String s : categoryList) {%>
        catArray.push('<%=s%>');
    <%} %>
    var autoCompleteCategory = new A.AutoComplete( 
    { 
        contentBox: '#<portlet:namespace />contactOptions',
        input:'#<portlet:namespace/>category',
        dataSource: catArray, 
        delimChar: ',', // **remove this attribute**
        typeAhead: true, 
    }).render();

I think this should work.

Also clear your browser cache before trying it 🙂