Creating an AutoComplete Textbox in Salesforce

Hello There! Welcome Back 🙂

Today we are gonna learn how to create an autocomplete field using apex:inputText.

For this, we are gonna use the list attribute of the apex:inputText component.

So, let's get started!

In your visualforce page, create an input field using apex:input component as shown below.

Note: This feature works only when the docType of our apex page is set to “html-5.0″.
If our browser doesn’t support this, we will be using jQuery (I will write a blog on that soon).

<apex:page Controller="autoCompleteCon" docType="html-5.0">
   <apex:form>
      <apex:inputText list="{!listOfStrings}"/>
   </apex:form>
</apex:page>

Next, lets prepare the list in the apex controller. For example, we are creating a list of account names as shown below.

public class autoCompleteCon {

    public List < String > listOfStrings { get; set; }

    //Constructor
    public autoCompleteCon() {
        listOfStrings = new List < String > ();
        for (Account a: [SELECT id, Name From Account LIMIT 10])
            listOfStrings.add(a.name);
    }
}

And once you save this, your input field looks like this:

So, there it is! We just learned how to create an AutoComplete field just by using Visualforce and apex. How cool, right?

If you like the content, give it some sharing :)