0

I need to make a search input - which every character that printed on the keyboard will show the closest result.

for example :

If I printed "uni" all accounts that they names starting with "uni" will appear for selecting.

I wrote a javascript function that calls for a method in the controller for this task, but I don't sure that this is the best way to do it - since every letter I tap in my keyboard, is calling the controller and make a SOQL query.

Can anyone please help me to achieve a better way for this?

This is my code :

Page :

 <apex:page controller="ExmpleController">

<script>
    function search(){
     doSearch();
    }

</script>

<apex:form >
    <apex:actionFunction name="doSearch" action="{!searchForAccounts}" reRender="accountTable"/>
        <apex:pageBlock >

            <apex:outputText >Account Name</apex:outputText>
                <apex:inputText value="{!name}" onkeyup="search();"/>
            <apex:pageBlockSection columns="3">

                <apex:pageBlockTable id="accountTable" value="{!accounts}" var="acc">
                    <apex:column value="{!acc.Name}"/>
             </apex:pageBlockTable>

            </apex:pageBlockSection>

        </apex:pageBlock>

</apex:form>

And the Controller :

public class ExmpleController  {
    public list<Account> accounts { get; set; }
    public String name { get; set; }

    public ExmpleController(){
        accounts = new list<Account>();
    }

    public pageReference searchAccounts(){

        string query ='';

        if(name !=''){

            query = 'Select Name  From Account Where Name like \''+name+'%\' LIMIT 5';
            accounts = database.query(query);
        }
        else{

            query = 'Select Name From Account LIMIT 5';
            accounts = database.query(query);
        }

        return null;
    }
}

Thanks!

  • 1
    One optimization would be to call server side method after user has entered 2 or 3 character. – Raul Feb 25 '19 at 8:17
  • That nice, but it can be confusing for some users since they will not find their accounts in the first letter... or will not notice the helped text for this (since some of the users are pretty old). – Salvation Feb 25 '19 at 8:23
0

Actually, this is how searches work. What you have implemented looks correct and is very easy to use for the end-user. However, If you want to optimize this, I can think of the following approaches:

  1. Let the user enter at least 2-3 characters before making the query.
  2. Add a delay and check if the user has stopped typing before querying. This will reduce your number of queries. Reference: https://stackoverflow.com/a/4220182/6415948
  3. Use a blur event instead of the change event.

But again, as I have said these approaches might not really help in the user experience.

If you're comfortable shifting this implementation to lightning components, you can cache the results. This way if a search string is searched two times, it can be fetched from the cache the second time.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.