I have an LWC component which has a list of records displayed onload from a wire method. I have an Add button below the list to create new values from a modal save. Now, When I click the add button, I can see the new record getting created in the backend but I could not see the added value in the UI


    <template if:true={causerecs}>                        
        <template for:each={causerecs} for:item="cause">                        
            <p key={cause.Id}>
    <div class="cpcm-container cpcm-button">
        <lightning-button-icon class="cpcm-button-icon" icon-name="utility:add" variant="bare-inverse"
            alternative-text="Add Cause" size="small" onclick={handleCreateCause}>
    <template if:true={error}>
    <!-- add cause modal -->
    <template if:true={isCreateCauseModal}>
        <section role="dialog" tabindex="-1" class="slds-modal slds-fade-in-open">
            <div class="slds-modal__container">
                <!-- header -->
                <header class="slds-modal__header">
                    <button class="slds-button slds-button_icon slds-modal__close slds-button_icon-inverse" title="Close" onclick={handleCauseModalClose}>
                            <lightning-icon icon-name="utility:close" alternative-text="close" variant="inverse" size="small"> </lightning-icon>
                            <span class="slds-assistive-text">Close</span>
                    <h2 id="modal-heading-01" class="slds-text-heading_medium slds-hyphenate">Create New Cause

                <!-- body -->
                <lightning-record-edit-form object-api-name="GRA_Risk_Event_Leg__c" onsubmit={createNewRec}>
                    <div class="slds-modal__content slds-p-around_x-large">
                        <div class="slds-col">
                            <lightning-input-field field-name="Description_Long__c"></lightning-input-field>


                    <!-- footer -->
                    <footer class="slds-modal__footer">
                        <lightning-button class="slds-m-right_small" variant="neutral" name="cancel"
                            label='Cancel' title='Cancel' onclick={handleCauseModalClose}></lightning-button>
                        <lightning-button variant="brand" name="" label='Save' title='Save' type="submit">
        <div class="slds-backdrop slds-backdrop_open"></div>


import { LightningElement,api, track, wire } from 'lwc';
import { refreshApex } from '@salesforce/apex';

export default class causeandprevention_lwc extends LightningElement {

    @api riskcausedetailrecord;
    @track causerecs;
    @track error;
    @track isCreateCauseModal = false;


    @wire(getCauseRecords, {reId: '$riskcausedetailrecord'})
    causeRecords({data, error}){
            this.causerecs = data;
            this.error = undefined;
        else if (error) {
            this.error = error;
            this.causerecs = undefined;
    handleCreateCause() {
        this.isCreateCauseModal = true;
        //this.cntrid = this.containeridselected;
    handleCauseModalClose() {
        this.isCreateCauseModal = false;
    createNewRec(event) {
        var descval = event.detail.fields;
        descval.GRA_Risk_Event__c = this.riskcausedetailrecord;
        var riskeventleg1 = JSON.stringify(descval);
        var type1 = 'Cause';

        saveNewCauseOrConsequenceCard({ riskEventLeg: riskeventleg1, type: type1 }) 
            .then(result => {
                this.isCreateCauseModal = false;
                console.log('result for cause creation' + JSON.stringify(result));
                return refreshApex(this.causerecs);



I used refreshApex in the save method to refresh the wired property but this is still not refreshing the list.

Expected: I would like to show the updated list on clicking save in the modal. Any way to refresh the list in UI on clicking save.

I have 4 records here and added the fifth but the fifth record is getting displayed only on manual refresh.

enter image description here

  • You must pass the whole object returned by the wire adapter to refreshApex, not just the data property. Please see this: Refresh Apex in LWC not working
    – RubenDG
    Commented Apr 8, 2023 at 12:41
  • This did wok :-), Thanks @RubenDG for you help on this.
    – sfdcDev
    Commented Apr 8, 2023 at 15:06
  • One question though, @RubenDG, will the refreshApex work only for wired methods, can we use for custom methods aswell?
    – sfdcDev
    Commented Apr 8, 2023 at 15:11
  • refreshApex needs the value provisioned by a wire adapter, using data returned by an apex method called imperatively won't work. In this case you have to call that method again.
    – RubenDG
    Commented Apr 8, 2023 at 20:24


Browse other questions tagged .