HTML code:
<template>
<lightning-card title="Account Table">
<lightning-input value={name} onchange={handleChange}></lightning-input>
<lightning-button variant="brand-outline" label="Search" onclick={handleSeach}></lightning-button>
<template if:true={accList}>
<lightning-datatable
key-field="Id"
data={accList}
columns={column}>
</lightning-datatable>
</template>
<template if:false={accList}>
No Account Found
</template>
</lightning-card>
</template>
JS:
import { LightningElement, track } from 'lwc';
import searchAccount from '@salesforce/apex/GetAccountFromLWC.searchAccount'
const columns=[
{label:'Account Name', fieldName:'Name', type:'text'},
{label:'Phone', fieldName:'Phone', type:'phone'},
{Label:'Email', fieldName:'Email', type:'email'}
];
export default class ShowAccountDataInTable extends LightningElement {
@track name='';
@track accList;
column=columns;
handleChange(event){
this.name=event.target.value;
}
handleSeach(){
searchAccount({accName:this.name})
.then(result => {
this.accList=result;
console.log('Account Found ', result);
})
.catch(error =>{
this.accList='';
console.log('Error occured ', error);
})
}
}