0

I am trying to update record in Lightning Web component through lightning-record-form. The issue I am facing is - I does not show updated records on Save immediately until I refresh it. I have tried using refreshApex, calling apex imperatively also. But nothing worked for me.

Here's my code -

    @api recordId;
    @track bears;
    wiredbearResult;
    @wire(searchBears, {searchTerm: '$searchTerm'})
    wiredBears(result) {
      console.log('result', result);
      this.wiredbearResult = result;
      if (result.data) {
        this.bears = result.data;
      } else if (result.error) {
        this.error = result.error;
     }
   }

    handleSubmit(event) {
      return refreshApex(this.wiredbearResult);
   }

And this is my html file code -

    <lightning-record-form
      record-id={recordId}
      object-api-name="Bear__c"
      layout-type="Full"
      mode="edit"
      onsubmit={handleSubmit}>
   </lightning-record-form>

Any suggestions, what I am missing?

1
  • Actually, I think the right approach is to use onsuccess and a handler that calls refreshApex with the wiredbearResult...
    – Phil W
    May 9, 2020 at 13:07

1 Answer 1

1

I believe the problem is that the refreshApex is being called too early in the process. Change your code as follows:

@api recordId;
@track bears;
wiredbearResult;
@wire(searchBears, {searchTerm: '$searchTerm'})
wiredBears(result) {
  console.log('result', result);
  this.wiredbearResult = result;
  if (result.data) {
    this.bears = result.data;
  } else if (result.error) {
    this.error = result.error;
  }
}

handleSuccess(event) {
  return refreshApex(this.wiredbearResult);
}

And:

<lightning-record-form
  record-id={recordId}
  object-api-name="Bear__c"
  layout-type="Full"
  mode="edit"
  onsuccess={handleSuccess}>
</lightning-record-form>

The difference is that the success event is raised once the creation or editing has been successfully applied on the server, allowing you to cleanly update the UI using refreshApex after that has happened, whereas the submit event is invoked when the user attempts to save the data in the form and is expected to actually then send the data to the server. This sending is an async operation.

3
  • This worked for me. Thanks a lot :)
    – Shivani
    May 10, 2020 at 14:13
  • not for me.....
    – Json
    Aug 6, 2022 at 13:32
  • @Json Feel free to raise a new question to explain your issue and to provide the details of what you have tried. Remember that the value you get from the wire must be stored without any destructing otherwise it cannot be used with refreshApex.
    – Phil W
    Aug 6, 2022 at 14:55

You must log in to answer this question.

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