Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • AutoComplete in liferay

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 1.27k
    Comment on it

    Hello Guys,

        Liferay provides inbuilt auto complete or auto-suggestion. Autocomplete is an inbuilt function of alloy script which is allowed to customize the auto-complete list (i.e UI and action)

    Liferay AUI has had javascript component, which is an Auto Complete List. It helps suggest or populate matching values in the input field while typing something in the input field.


    Follow below steps :

    Step 1 : Create JSP page and put below code

    <%@page import="com.liferay.portal.kernel.util.Constants"%>
    
    <portlet:actionURL var="getlocation" name="getlocation">
                <portlet:param name="<%=Constants.CMD%>" value="get_places" />
    </portlet:actionURL>
    
    <aui:input id="inputField" name="inputField" label="Location"
                helpMessage="Type Some text in Input" />
    
    <aui:script>
    
    AUI().use('autocomplete-list','aui-base','aui-io-request','autocomplete-filters','autocomplete-highlighters',function (A) {
    A.io.request('<%=getlocation%>',{
    dataType: 'json',
    method: 'GET',
    on: {
    success: function() {
    new A.AutoCompleteList(
    {
    allowBrowserAutocomplete: 'true',
    activateFirstItem: 'true',
    inputNode: '#<portlet:namespace />inputField',
    resultTextLocator: 'name',
    
    render: 'true',
    
    resultHighlighter: 'phraseMatch',
    
    resultFilters:['phraseMatch'],
    
    source:this.get('responseData'),
    })
    }}
    });
    });
    
    </aui:script>

     

    Step 2: Create Action or controller class and put below methods 

    @Override
                 public void getlocation(ActionRequest actionRequest, ActionResponse actionResponse) throws IOException, PortletException {
                   String cmd = ParamUtil.getString(actionRequest, Constants.CMD);
                 
                  System.out.println("Constants.CMD: " + cmd);
    
                  if (cmd.equals("get_places")) {
                    getPlaceJson(actionRequest, actionResponse);
                  }
                 
                }
    
                private void getPlaceJson(ActionRequest actionRequest, ActionResponse actionResponse) throws IOException, PortletException {
    
                  JSONArray jsonResults = JSONFactoryUtil.createJSONArray();
                  try {
                    String keyword = ParamUtil.getString(actionRequest, "keywords");
                    String searchPattern = keyword.replace("*", "%");
    
                    System.out.println("Keywords: " + searchPattern);
    
                    JSONObject jsonCells = JSONFactoryUtil.createJSONObject();
                    jsonCells.put("key", "1");
                    jsonCells.put("name", "Pune, India");
                    jsonResults.put(jsonCells);
                    jsonCells = JSONFactoryUtil.createJSONObject();
                    jsonCells.put("key", "2");
                    jsonCells.put("name", "New Delhi, India");
                    jsonResults.put(jsonCells);
                    jsonCells = JSONFactoryUtil.createJSONObject();
                    jsonCells.put("key", "3");
                    jsonCells.put("name", "Dehradun, India");
                    jsonResults.put(jsonCells);
                  } catch (Exception e) {
                             
                  }
                  PrintWriter out=actionResponse.getWriter();
         out.println(jsonResults.toString());
                }

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: