I am trying to build a lighting web component which uses lightning datatable with Server side search capabilities.

here is the code: I am not sure what I am doing wrong.



    <div class="slds-m-around_medium"> 
        <lightning-input type = "search" value={searchKey} onchange={handleKeywordChange}>

    <template if:false={Acc} >
                                key-field="id" >


import { LightningElement, wire, track, api } from 'lwc';

import Id from '@salesforce/user/Id';
import fetchAccounts from '@salesforce/apex/ManageAccounts.fetchAccounts'

const columns = [
        label: 'Account ID',
        fieldName: 'ID',
        editable: true
    }, {
        label: 'Account Name',
        fieldName: 'Name',
        editable: true

    }, {
        label: 'Account Number',
        fieldName: 'AccountNumber',
        editable: true

    }, {
        label: 'Account Type',
        fieldName: 'Type',
        editable: true

export default class ManageAccount extends LightningElement {

userId = Id;
@track searchKey;
@track columns = columns;
@track Acc;
@track error;

                userId: this.userId,
                searchKey: this.searchKey
            .then( response => {
                this.Acc = response;
                this.error = undefined;
            .catch (e => {
                this.error = e;
                this.Acc = undefined;

        this.isSearchChangeExecuted = false;  
        this.searchKey = event.target.value; 


public with sharing class ManageAccounts {
    @AuraEnabled (cacheable=true)
    public static List<Account> fetchAccounts( string userId, string searchKey){

        List <Account> acclist = new List<Account>();
        string strgkeyword = '%'+searchKey+'%';
        string query = 'SELECT Id, Name, AccountNumber, Type  FROM Account WHERE OwnerId=: userId' ; 
            query += ' AND Name LIKE \'%'+searchKey+'%\';
        acclist = Database.query(query);
        return acclist;
  • Updated the dynamic query on the controller file based on input from @sfdcfox which was one of the issue.
  • Please edit this post to clearly state the problem and ask a question, including only the code that is relevant to the problem you're seeing help with. See How to Ask.
    – David Reed
    Apr 15, 2020 at 0:02

1 Answer 1


Onchange might not be fired until the input is blurred (lost focus). This is really browser-dependent behavior. You might want to just use onkeyup with a small delay:

<lightning-input ... onkeyup={startSearchTimer} ...


startSearchTimer(event) {
  this.timerId = setTimeout(this.doSearch.bind(this),500);
doSearch() {
  .then(data => {
    this.Acc = data;
    this.error = null;
  .catch(error => {
    this.Acc = null;
    this.error = error;
  • HI @sfdcfox, I tried with onkeyup, still I don't get the data on the datatable. Maybe there is issue with my SOQL?
    – mubs
    Apr 15, 2020 at 4:44
  • 1
    @MubeenQawi Oh, yeah, you're missing quotes.
    – sfdcfox
    Apr 15, 2020 at 5:26
  • thanks @sfdcfox, once i fixed the query, i was able to render the data. But the table load and search experience overall is not ideal (due to the delay). But this has helped me test out and convey a message. I might go for client side search for better UX.
    – mubs
    Apr 15, 2020 at 19:24

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .