Preview
HTML
<template>
<lightning-card title="Search Account" icon-name="standard:search">
<div class="slds-var-m-around_medium">
<strong>
<lightning-input class=""
type="search"
label="Enter Name or Phone"
value={searchName}
onkeyup={searchHandler}>
</lightning-input>
</strong>
<template if:true={Accounts}>
<div>Search Result: </div>
<template for:each={Accounts} for:item="ac">
<div class="slds-var-m-around_medium" key={ac.Id}>
<strong>Account Name: </strong> {ac.Name} <br/>
<strong>Rating: </strong> {ac.Rating} <br/>
<strong>Phone: </strong> {ac.Phone} <br/>
</div>
</template>
</template>
</div>
</lightning-card>
</template>
Java Script
import { LightningElement } from 'lwc';
import getAllAccounts from '@salesforce/apex/AccountUtility.getAllAccounts';
export default class SearchAccount extends LightningElement {
searchName;
searchPhone;
Accounts;
searchHandler(event) {
this.searchName = event.target.value;
this.searchPhone = event.target.value;
if(this.searchName != null || this.searchPhone != null){
getAllAccounts({searchKey: this.searchName || this.searchPhone})
.then(result => {
this.Accounts = result;
})
.catch(error =>{
this.error = error;
});
}
}
}
Apex Class
public class AccountUtility {
@AuraEnabled(cacheable=true)
public static List<Account> getAllAccounts( String searchKey){
if(String.isNotBlank(searchKey)){
searchKey = '%' + searchKey + '%';
return [SELECT Id, Name, Phone, Rating FROM Account WHERE name LIKE : searchKey OR Phone LIKE : searchKey
WITH SECURITY_ENFORCED];
}
else {
return null;
}
}
}
Video
Video does not exists.
