How To Make Dynamic Search Using Salesforce Lightning and Regular Expression?

Hello guys,

Today, I am sharing the code, that, how you can implement Dynamic Search using Lightning Component, the output is similar to the previous post, but the strategy is different. Here I am going to use JavaScript Library called Regular Expression, name as, regex. And I am also going to use lightning:datatable.

For this task, we need three things:-

  1. Lightning Component Bundle
  2. A Lightning Application Bundle
  3. An Apex Controller.

First, let’s create an apex controller:-

public class AccountShowController {


public static List showAccounts()


return [SELECT Id, Name, Phone, AnnualRevenue From Account];



Let’s now create our Lightning Component( AccountShowUsingJS.cmp)-

<aura:component controller="AccountShowController">
<aura:attribute name="Account" type="Account[]"></aura:attribute></aura:component>

Search Account


JS Controller:-


myAction : function(component, event, helper) {

component.set(‘v.columns’, [

{label: ‘Account name’, fieldName: ‘Name’, type: ‘text’},

{label: ‘Phone’, fieldName: ‘Phone’, type: ‘number’},

{label: ‘Annual Revenue’, fieldName: ‘AnnualRevenue’, type: ‘number’}


var action = component.get(“c.showAccounts”);

action.setCallback(this, function(response){

var state=response.getState();

if(state === ‘SUCCESS’)


component.set(“v.Account”, response.getReturnValue());

component.set(“v.AccountDuplicate”, response.getReturnValue());









SearchAccount : function(component, event, helper) {

//var searchKey = component.get(“v.SearchKey”);

var term = component.get(“v.SearchKey”);

var data = component.get(“v.AccountDuplicate”);

//component.set(“v.Account”, data);


var results = data, regex;

try {

console.log(“inside try”);

regex = new RegExp(term, “i”);
// filter checks each row, and the constructs new array where function returns true

results = data.filter(row=>regex.test(row.Name));


} catch(e) {

// invalid regex, use full list


component.set(“v.Account”, results);



An application component(

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



Happy Coding.


Leave a Reply


We're not around right now. But you can send us an email and we'll get back to you, asap.


About Us

Forcetalks is a Salesforce collaboration platform for coders & developers, geeks & nerds, consultants & business heads, admins & architects, managers & marketers and of course the business owners. A community where you can learn from, where you can contribute to. For you. For Salesforce. Read More...

Copyright 2020 Forcetalks. All Right Reserved.

Log in with your credentials


Forgot your details?