I have a use case where I am fetching records by searching and showing them in a datatable. After that using checkboxes I select some records and delete them. But the problem is after deleting the datatable does not show the updated records.
html –>
<template>
<lightning-card>
<h3 slot="title">
<img src={stupng} width="42" height="30" style="vertical-align:top">
Student Informations
</h3>
<lightning-layout multiple-rows="true" vertical-align="end">
<lightning-layout-item size="12" small-device-size="4" medium-device-size="2" padding="around-small">
<div class="slds-form-element">
<div class="slds-form-element__control">
<lightning-combobox title="Search student" label="Enter Detail" value={studentSearchParameter} placeholder="--Select--"
options={options} onchange={handleOptionChange} required></lightning-combobox>
</div>
</div>
</lightning-layout-item>
<lightning-layout-item size="12" small-device-size="4" medium-device-size="2" padding="around-small">
<lightning-button title="Search Button" label="Search" variant="brand" icon-name="utility:search"
icon-position="right" onclick={handleStudentSearch}></lightning-button>
</lightning-layout-item>
<lightning-layout-item size="12" small-device-size="4" medium-device-size="2" padding="around-small">
<lightning-button title="Delete Button" label="Delete" size="small" variant="brand" icon-name="utility:delete"
icon-position="right" onclick={deleteStudentRowAction}></lightning-button>
</lightning-layout-item>
</lightning-layout>
<div>
<lightning-datatable
key-field="Id"
data={studentRec}
columns={c}
onrowselection={getSelectedIdAction}>
</lightning-datatable>
</div>
</lightning-card>
</template>
js –>
import { LightningElement, track, api, wire } from 'lwc';
import searchStudent from '@salesforce/apex/lwcStudentSearch.searchStudent';
import deleteMultipleStudentRecord from '@salesforce/apex/lwcStudentSearch.deleteMultipleStudentRecord';
import {ShowToastEvent} from 'lightning/platformShowToastEvent'
import studentlogo from '@salesforce/resourceUrl/studentlogo'
import { refreshApex } from '@salesforce/apex';
const columns = [
{ label: 'Student Name', fieldName: 'Name' },
{ label: 'Roll Number', fieldName: 'Roll_Number__c', type:'Number'},
{ label: 'Location', fieldName: 'Geo_Location__c', type: 'Lookup' },
];
const options = [
{label:'Aaron',value:'Aaron'},
{label:'Aayush',value:'Aayush'},
{label:'Prakriti',value:'Prakriti'},
{label:'Krishna',value:'Krishna'},
{label:'Akash',value:'Akash'},
{label:'Sourav',value:'Sourav'},
{label:'Prakash',value:'Prakash'},
{label:'David',value:'David'},
{label:'Rohit',value:'Rohit'},
{label:'Christian',value:'Christian'},
{label:'Katy',value:'Katy'},
];
export default class LwcStudentSearch extends LightningElement {
@track studentRec;
searchValue = '';
c=columns
stupng = studentlogo
@track options=options;
@api selectedStudentIdList=[];
handleOptionChange(event) {
this.searchValue = event.detail.value;
}
handleStudentSearch() {
if (this.searchValue !== '') {
searchStudent({
searchKey: this.searchValue
})
.then(result => {
this.studentRec = result;
})
} else {
const event = new ShowToastEvent({
variant: 'error',
message: 'Search text missing....',
});
this.dispatchEvent(event);
}
}
getSelectedIdAction(event){
const selectedStudentRecords = event.detail.selectedRows;
this.selectedStudentRecords=[];
for (let i = 0; i<selectedStudentRecords.length; i++){
this.selectedStudentIdList.push(selectedStudentRecords[i].Id);
}
}
deleteStudentRowAction(){
deleteMultipleStudentRecord({studObj:this.selectedStudentIdList})
.then(()=>{
this.template.querySelector('lightning-datatable').selectedStudentRecords=[];
const toastEvent = new ShowToastEvent({
title:'Success!',
message:'Record(s) deleted successfully',
variant:'success'
});
this.dispatchEvent(toastEvent);
})
return refreshApex(this.studentRec);
}
}
Aura Class –>
public with sharing class lwcStudentSearch {
@AuraEnabled(cacheable=true)
public static list<Student__c> searchStudent(string searchKey){
string searchKeyword = '%' + searchKey + '%';
list<Student__c> studentListRecord = new list<Student__c>();
for(Student__c stuObj : [Select Name, Roll_Number__c, Geo_Location__r.Name
From Student__c
WHERE Name LIKE : searchKeyword]){
studentListRecord.add(stuObj);
}
return studentListRecord;
}
@AuraEnabled
public static List<Student__c> deleteMultipleStudentRecord(List<String> studObj){
List<Student__c> stuObjItem = new List<Student__c>();
List<Student__c> stuObjList = [Select Id, Name From Student__c Where Id IN:studObj];
for(Student__c con:stuObjList){
stuObjItem.add(con);
}
if(stuObjItem.size()>0){
try{
delete stuObjItem;
}
catch (Exception exp) {
throw new AuraHandledException(exp.getMessage());
}
}
return stuObjItem;
}
}
I am quite new and learning LWC, please excuse any silly mistakes I have made.
Best Answer
As stated in the documentation
So instead of calling
refreshApex()
you should just callhandleStudentSearch()
;Call it in the
then
callback body ensureshandleStudentSearch()
would run only after the records deletion.