Friday, May 17, 2019

Lightning Component search box

Here we will build a simple account search lightning component based on the topics we have completed before this.


<aura:component controller="searchAccountController" >
    <aura:attribute name="keywordHolder" type="string" /> // Declaring attribute to hold value
    <aura:attribute name="accountList" type="list" /> // Declaring attribute to hold account list
    <lightning:input name="AccountSearch"  label="Enter Account Name" value="{!v.keywordHolder}"/>  // Linking user input with attribute through value parameter.
    <lightning:button label="Search Account" onclick="{!c.findAccount}" />
    <aura:iteration var="acc" items="{!v.accountList}" >   // Displaying list of account


 findAccount : function(component, event, helper) { 
        var action=component.get('c.fetchAccount');
            searchKeyWord : component.get("v.keywordHolder")         
        });   // setParams is optional, since we are expecting parameter in apex controller method we are passing the user entered value in the apex controller method.
        action.setCallback(this,function(response){          // Getting the response back
            var state=response.getState();
            var response1=response.getReturnValue();


Apex Controller:

public class searchAccountController {
 public static List < account > fetchAccount(String searchKeyWord) {
  String searchKey = searchKeyWord + '%';
  List < Account > returnList = new List < Account > ();
  List < Account > lstOfAccount = [select id, Name, Type, Industry, Phone, Fax from account where Name LIKE: searchKey limit 1];

  for (Account acc: lstOfAccount) {
  return returnList;


<aura:application extends="force:slds" >


Account search Lightning components

No comments:

Post a Comment