0

I am building a VF component which can be used to display records of any object as well as Ability to search the records by Name. I am struck with implementing the search part. My search feature is to display the records as the user keys in the letter in search box.

My VF page just uses the component and takes an attribute of which object I should display. For example if I want to display Account on the VF page. I use:

My VF Page:

<apex:page controller="DynamicTableController">
<c:SampleComponent Record="Contact"/>    
</apex:page>

How it looks:

enter image description here

The re-usable VF component that I am using is called sampleComponent. I use a controller which is based on StandardSetController which fetch records dynamically based on the record name given as an attribute at controllerValue

<apex:component controller="SampleComponentController" >
      <script type="text/javascript">
      function doSearch() {
        searchServer(
          document.getElementById("searchName").value
          );
      }
      </script> 
    <apex:attribute name="record" description="The type of record we are viewing."
                    type="String" required="true" assignTo="{!controllerValue}"/>
 <apex:form >                    
    <apex:pageBlock title="Viewing {!record}">   
    Name: <apex:inputText label="Name" id="searchName" onkeyup="doSearch();"/>

      <apex:actionFunction name="searchServer" action="{!runSearch}" rerender="results">
          <apex:param name="searchName" value="" />
      </apex:actionFunction>
    </apex:pageBlock>    

<apex:pageblock >

<apex:pageblocktable value="{!Records}" var="a" id="results">

<apex:column value="{!a['Name']}"/>

</apex:pageblocktable>
</apex:pageblock>
</apex:form>
</apex:component>

SampleComponentController Class:

public class SampleComponentController {

public String controllerValue;
public String searchName{get;set;}

private ApexPages.StandardSetController setController{
        get {
            if(setController==NULL){
                String qury = 'SELECT Name,Phone FROM ' + controllerValue;
                List<Sobject> recordsList= database.query(qury);
                setController = new ApexPages.StandardSetController(recordsList);

            }
            return setController;
        }
        set;
    }

    public List<Sobject> getRecords(){
        return (List<Sobject>) setController.getRecords();
    }

   public void setControllerValue (String s) {
    controllerValue = s;
  }

  public String getControllerValue() {
    return controllerValue;
  } 



   private String soql {get;set;}

  // runs the search with parameters passed via Javascript
  public PageReference runSearch() {

    String searchName= Apexpages.currentPage().getParameters().get('searchName');

    soql = 'select Name from' + controllerValue + 'where name != null';

   soql += ' and name LIKE '  + String.escapeSingleQuotes(searchName) + '%';

   // run this newly formed soql query and set the result to setController
   // so that the result on VF component can change as user key in each letter

    return null;
  }
}

My reference to the code is from Jeff Douglas article - http://blog.jeffdouglas.com/2010/07/13/building-a-dynamic-search-page-in-visualforce/ . I am experiencing a challenge in implementing the search functionality. I need to get the value of the letters which are keyed in search box and form a query string. This query string should be used with the setController variable so that my page refreshes and gives me result as expected.

A demo of this feature - https://jeffdouglas-developer-edition.na5.force.com/examples/CustomerSearch

Is this right approach or is there a better way to do it? Any help or suggestions is appreciated!

  • 1
    You do not want to do this using page refreshes and AJAX. You would want to use Visualforce Remoting to implement a "TypeAhead" like feature. Search keyword typeahead and you will find plenty of examples – Eric Dec 2 '16 at 19:05
  • Does it make sense to use StandardSetController with TypeAhead. I have to get some bunch of records and may be add pagination to it. I am building a list view feature where user can search the records, sort by any column, and has pagination feature.. – SfdcBat Dec 2 '16 at 19:33
  • If you have a defined list of data I would look into implementing Datatables.net or similar library. You do not want to have to make roundtrips to the server and / or refresh the dom on each keystroke as it would be a nightmare for the user. – Eric Dec 2 '16 at 19:35
  • @Eric By looking at my controller or the way I get the list of records does it look like I have a defined list of Record. Which approach do you think is best for me to try out? I also want to implement features like quick create , delete records and inline edit from the table list view. Appreciate your inputs! – SfdcBat Dec 2 '16 at 21:56

Your Answer

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

Browse other questions tagged or ask your own question.