function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Olga Kim 14Olga Kim 14 

Navigation Mixin with if statements

Hi All,
I have a task where I need to create LWC that has two if statements and NavigationMixin. 
The logic is if the account has account number and it's revenue is not less than $1000, then open a window with a new account that has some predefined values. 
Please, see attached code. 
 
import { LightningElement, api, track, wire } from 'lwc';
import { NavigationMixin } from 'lightning/navigation';
import getAccounts from '@salesforce/apex/accountAura.getAccounts';
import { encodeDefaultFieldValues } from 'lightning/pageReferenceUtils';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';

export default class HelloWorld extends NavigationMixin(LightningElement)  {
    @api recordId;

    @track activeStatus='';
    @track accNumber=0;
    @track accRevenue=0;
    @track error=undefined; 
   
    //accessing fields and assigning them to variables
    @wire(getAccounts, {accountID:'$recordId'})
     wiredRecord(result) {
       
       if (result.data) {
         this.error = undefined;
         
         this.activeStatus = result.data.Active__c;
         this.accNumber = result.data.AccountNumber;
         this.accRevenue=result.data.AnnualRevenue;
         
       } else if (result.error) {
         this.error = result.error;
         console.log(result.error);
         this.dispatchEvent(
           new ShowToastEvent({
               title: 'error',
               message: result.error.body.message,
               variant: 'error'
           })
       );     
       }
     }
     
 
     //fire event when user push the button 
     connectedCallback(){
 
         if (this.accNumber==null)
   {
     this.dispatchEvent(
         new ShowToastEvent({
             title: 'error',
             message: 'Account Number cant be null',
             variant: 'error'
         })
     );  
        
     return;    
   }  
 
   else if (this.accRevenue<1000){
    
     this.dispatchEvent(
         new ShowToastEvent({
             title: 'error',
             message: 'You cant submit because Account Revenue is less than $1,000',
             variant: 'error'
         })
     );  
      
     return;  
     
 
   }
   
     else { 
 
           navigateToNewContactWithDefaults();
    
          }
 
   }
 
     //function with default values
     navigateToNewContactWithDefaults() {
         const defaultValues = encodeDefaultFieldValues({
             AccountNumber: this.accNumber,
             AnnualRevenue: this.accRevenue,
             Active__c: 'Yes'
         });
 
         console.log(defaultValues);
 
         this[NavigationMixin.Navigate]({
             type: 'standard__objectPage',
             attributes: {
                 objectApiName: 'Account',
                 actionName: 'new'
             },
             state: {
                 defaultFieldValues: defaultValues
             }
         });
     }
}



For some reason, the LWC ignores if statements and open the window anyway. 

Can I use NavigationMixin and if statements in one LWC?
How can I fix this issue?

  
Thank you, in advance. 
Best Answer chosen by Olga Kim 14
Maharajan CMaharajan C
Hi Kim,

Here the connected callback will fire before the wire adapter. So obiviously the account number will be Null.

To overcome this instead of connected callback. Add all the Account Number and Revenue logic checks in new JS method and then invoke this method inside wire adapter result. 

Also debug the account number whether you are null or something else.

Please refer the below code :

import { LightningElement, api, track, wire } from 'lwc';
import { NavigationMixin } from 'lightning/navigation';
import getAccounts from '@salesforce/apex/accountAura.getAccounts';
import { encodeDefaultFieldValues } from 'lightning/pageReferenceUtils';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';

export default class HelloWorld extends NavigationMixin(LightningElement)  {
    @api recordId;

    @track activeStatus='';
    @track accNumber=0;
    @track accRevenue=0;
    @track error=undefined; 
   
    //accessing fields and assigning them to variables
    @wire(getAccounts, {accountID:'$recordId'})
     wiredRecord(result) {
       
       if (result.data) {
         this.error = undefined;
         
         this.activeStatus = result.data.Active__c;
         this.accNumber = result.data.AccountNumber;
         this.accRevenue=result.data.AnnualRevenue;
         this.checkAccountRevenue();
         
       } else if (result.error) {
         this.error = result.error;
         console.log(result.error);
         this.dispatchEvent(
           new ShowToastEvent({
               title: 'error',
               message: result.error.body.message,
               variant: 'error'
           })
       );     
       }
     }
     
 
     //fire event when user push the button 
    checkAccountRevenue(){

    if (this.accNumber==null)
    {
    this.dispatchEvent(
     new ShowToastEvent({
         title: 'error',
         message: 'Account Number cant be null',
         variant: 'error'
     })
    );  

    return;    
    }  

    else if (this.accRevenue<1000){

    this.dispatchEvent(
     new ShowToastEvent({
         title: 'error',
         message: 'You cant submit because Account Revenue is less than $1,000',
         variant: 'error'
     })
    );  

    return;  


    }

    else { 

       this.navigateToNewContactWithDefaults();

      }

    }
 
     //function with default values
    navigateToNewContactWithDefaults() {
     const defaultValues = encodeDefaultFieldValues({
         AccountNumber: this.accNumber,
         AnnualRevenue: this.accRevenue,
         Active__c: 'Yes'
     });

     console.log(defaultValues);

     this[NavigationMixin.Navigate]({
         type: 'standard__objectPage',
         attributes: {
             objectApiName: 'Account',
             actionName: 'new'
         },
         state: {
             defaultFieldValues: defaultValues
         }
     });
    }
}


Thanks,
Maharajan.C

All Answers

Maharajan CMaharajan C
Hi Kim,

Here the connected callback will fire before the wire adapter. So obiviously the account number will be Null.

To overcome this instead of connected callback. Add all the Account Number and Revenue logic checks in new JS method and then invoke this method inside wire adapter result. 

Also debug the account number whether you are null or something else.

Please refer the below code :

import { LightningElement, api, track, wire } from 'lwc';
import { NavigationMixin } from 'lightning/navigation';
import getAccounts from '@salesforce/apex/accountAura.getAccounts';
import { encodeDefaultFieldValues } from 'lightning/pageReferenceUtils';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';

export default class HelloWorld extends NavigationMixin(LightningElement)  {
    @api recordId;

    @track activeStatus='';
    @track accNumber=0;
    @track accRevenue=0;
    @track error=undefined; 
   
    //accessing fields and assigning them to variables
    @wire(getAccounts, {accountID:'$recordId'})
     wiredRecord(result) {
       
       if (result.data) {
         this.error = undefined;
         
         this.activeStatus = result.data.Active__c;
         this.accNumber = result.data.AccountNumber;
         this.accRevenue=result.data.AnnualRevenue;
         this.checkAccountRevenue();
         
       } else if (result.error) {
         this.error = result.error;
         console.log(result.error);
         this.dispatchEvent(
           new ShowToastEvent({
               title: 'error',
               message: result.error.body.message,
               variant: 'error'
           })
       );     
       }
     }
     
 
     //fire event when user push the button 
    checkAccountRevenue(){

    if (this.accNumber==null)
    {
    this.dispatchEvent(
     new ShowToastEvent({
         title: 'error',
         message: 'Account Number cant be null',
         variant: 'error'
     })
    );  

    return;    
    }  

    else if (this.accRevenue<1000){

    this.dispatchEvent(
     new ShowToastEvent({
         title: 'error',
         message: 'You cant submit because Account Revenue is less than $1,000',
         variant: 'error'
     })
    );  

    return;  


    }

    else { 

       this.navigateToNewContactWithDefaults();

      }

    }
 
     //function with default values
    navigateToNewContactWithDefaults() {
     const defaultValues = encodeDefaultFieldValues({
         AccountNumber: this.accNumber,
         AnnualRevenue: this.accRevenue,
         Active__c: 'Yes'
     });

     console.log(defaultValues);

     this[NavigationMixin.Navigate]({
         type: 'standard__objectPage',
         attributes: {
             objectApiName: 'Account',
             actionName: 'new'
         },
         state: {
             defaultFieldValues: defaultValues
         }
     });
    }
}


Thanks,
Maharajan.C
This was selected as the best answer
Olga Kim 14Olga Kim 14
It works!!! Thank you very much, Maharajan! 

My LWC checks conditions (account number and annual revenue) and only after opens the window(NavigationMixin). 

But there is one small thing that needs to be changed. I notice that when add, for example, an account number to my record, my LWC won't see this account number unless I refresh my page.

Just to clarify, the logic of this LWC is to not show the New account window if the account number = null and annual revenue is less than $1000.  When I add the account number to the record and run LWC, it still shows that there is no Account number. I need to refresh the page in order to make this LWC see the change.

Do you know how to update record automatically? so users won't need to refresh their page before running this LWC. 


I really appreciate your help.      
Thank you,