1

In my LWC I create a new record, and after this want to navigate to the new record to allow the user to enter some required info. What I'm finding though, is although my navigate statement is after the create call (it calls a method to do the create), it runs the navigate before it's done the create.

Do I need to have some sort of pause in between calling the create method before the navigate?

    this.createCertificate();
    console.log(
      "After create, back in calling method - certificate Id + Name : " +
        this.certid +
        " " +
        this.certref
    );
    this[NavigationMixin.Navigate]({
      type: "standard__recordPage",
      attributes: {
        recordId: this.certid,
        actionName: "edit"
      }
    });

  createCertificate() {
    const fields = {};
    fields[RECTYPE_FIELD.fieldApiName] = this.recordTypeId;
    fields[ACCOUNT_FIELD.fieldApiName] = this.aid;
    fields[STATUS_FIELD.fieldApiName] = this.status;
    fields[CERTTYPE_FIELD.fieldApiName] = this.certtype;
    console.log("certificate fields : " + fields);
    const recordInput = { apiName: CERTIFICATE_OBJECT.objectApiName, fields };
    createRecord(recordInput)
      .then(cert => {
        const retCert = JSON.parse(JSON.stringify(cert));
        this.certref = retCert.fields.Name.value;
        this.certid = cert.id;
        console.log(
          "certificate Id + Name : " + this.certid + " " + this.certref
        );
        this.dispatchEvent(
          new ShowToastEvent({
            title: "Success",
            message: "Certificate created - Ref No: " + this.certref,
            variant: "success"
          })
        );

        if (this.isBio) {
          sendEmail({ cEmail: this.aemail, cId: this.certid, accId: this.aid })
            .then(result => {
              this.dispatchEvent(
                new ShowToastEvent({
                  title: "Success",
                  message: "Email has been sent",
                  variant: "success"
                })
              );
            })
            .catch(error => {
              this.dispatchEvent(
                new ShowToastEvent({
                  title: "Error on send",
                  message: error.message.body,
                  variant: "error"
                })
              );
            });
        }
      })
      .catch(error => {
        this.dispatchEvent(
          new ShowToastEvent({
            title: "Error creating record",
            message: error.body.message,
            variant: "error"
          })
        );
      });
  }

I also added 2 console.log statements - one in the createCertificate method, which, as the image below shows, displays after the one in the code snippet above, which I find confusing. I would expect the createCertificate method to run and complete before it moves to the next line of code. How do I get it to do so?

enter image description here

2
  • can you show createCertificate method? and also other related code? – salesforce-sas May 7 '20 at 22:56
  • I've added the method. Everything else runs fine - it creates the new record correctly. The success toast event displays too. – Irene May 7 '20 at 23:03
5

when createCertificate() is invokes, it invoked async method createRecord(recordInput) - but before it returns the result from server, the lines after that will be executed in synchronous way. You need fire navigation after the result is returned in then as below: (and remove navigation from top)

createRecord(recordInput)
  .then(cert => {
      .......
      this[NavigationMixin.Navigate]({
        type: "standard__recordPage",
        attributes: {
            recordId: this. cert.Id,
            actionName: "edit"
        }
        });
}

Option 2:

You can use async-await function.

async firstMethod() {
    ...
    const cert = await this.createCertificate();
    
    this[NavigationMixin.Navigate]({
      type: "standard__recordPage",
      attributes: {
        recordId: this.cert.Id,
        actionName: "edit"
      }
    });
}

and return new Promise in createCertificate() as shown in async-await function

5
  • The create is used for more than one type though, and it is only for this one type that I want to navigate to the record edit page, which is why I put it where it is. If I add it to the create method, I'll have to add a check in there for this type only. Is there no 'wait' function of sorts I could use? – Irene May 7 '20 at 23:15
  • I've put the code in as you said, with an if condition to check on the 'type' so it only does this for the correct type. – Irene May 7 '20 at 23:20
  • u have other way of implementation also which i added above – salesforce-sas May 7 '20 at 23:22
  • Cool thanks for that. My other problem is that it doesn't refresh the calling page after closing the called edit page - should I open a new query for that? – Irene May 7 '20 at 23:26
  • Didnt exactly understood what you mean. Probably better to create a new question – salesforce-sas May 7 '20 at 23:27

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.