3

I have a LWC that should be dynamic based on the data of the record if a certain field is notNull then it will display a button and if is null, then it will not

the thing is that when I update my data, my LWC do not get updated .. I need to reload the page to see it ...

All the post I saw where to refresh a lwc after an action from the LWC such as save

Could someone give me a direction ? thx you

enter image description here

This is the JS:

    import { LightningElement, wire, api } from 'lwc';
    import CurrentOppData from '@salesforce/apex/CurrentOppPackageInfo.CurrentOppData';
    import { NavigationMixin } from "lightning/navigation";
    import {updateRecord, getRecordNotifyChange} from 'lightning/uiRecordApi';
    import { ShowToastEvent } from 'lightning/platformShowToastEvent';
    import { refreshApex } from '@salesforce/apex';
    
    export default class OpenCreatePackagesOnBackOffice extends NavigationMixin(LightningElement) {
        OppData;
        @api recordId;
        isBoth = false;
        isPackageOnly = false;
        isToCreate = false;
        isWeired = false;
    
        @wire(CurrentOppData, { recordId: '$recordId' })
        OppInfo(wireResult) {
            const { error, data } = wireResult;
            this._wiredData = wireResult;
            if (data) {
                this.OppData = data;
                console.log('this is working')
                console.log(data);
                console.log(data[0]['Related_package_id__c'])
    
                if(data[0]['Related_package_id__c'] && data[0]['Related_Period_Id__c'] ){
                    this.isBoth = true
                } else if (data[0]['Related_package_id__c'] && !data[0]['Related_Period_Id__c']){
                    this.isPackageOnly = true;
                } else if ( !data[0]['Related_package_id__c'] && !data[0]['Related_Period_Id__c']) {
                    this.isToCreate = true;
                } else{
                    this.isWeired = true;
                }
            
            console.log('isBoth ' + this.isBoth);
            console.log('isPackageOnly ' + this.isPackageOnly);
            console.log('isPackageOnly ' + this.isToCreate);
            console.log('isWeired ' + this.isWeired);
            
            }
                
            else if (error) {
                this.error = error;
            }
        }
    
        handleClickOpenPackage() {
            
            const config = {
                type: 'standard__webPage',
                attributes: {
                    url: this.OppData[0]['OpenPackageOnBo__c']
                }
            };
            this[NavigationMixin.Navigate](config);
            console.log(this.OppData[0]['OpenPackageOnBo__c'])
          }
    
    }

My Apex:

    public class CurrentOppPackageInfo {
        public CurrentOppPackageInfo(){
            
        }
        
        
        @AuraEnabled(cacheable=true)
        public static List <Opportunity> CurrentOppData (Id recordId){
            return[Select id, Related_package_id__c, Related_Period_Id__c, OpenPackageOnBo__c, createPackageOnBO__c, OpenPeriodOnBO__c
                   from Opportunity 
                   WHERE id = :recordId];
        }
    
    }

my HTML:

    <template>
        <div class="slds-card slds-align_absolute-center slds-p-around_large">
            <template if:true={isBoth}>
                <lightning-button variant="brand" label="Open Package on Back Office" title="Primary action" onclick={handleClickOpenPackage} class="slds-m-left_x-small"></lightning-button><br>
                <lightning-button variant="brand" label="Open Period on Back Office" title="Primary action" onclick={handleClickOpenPeriod} class="slds-m-left_x-small"></lightning-button>
            </template>
            <template if:true={isPackageOnly}>
                <lightning-button variant="brand" label="Open Package on Back Office" title="Primary action" onclick={handleClickOpenPackage} class="slds-m-left_x-small"></lightning-button>
            </template>
            <template if:true={isToCreate}>
                <lightning-button variant="brand" label="Create Package on Back Office" title="Primary action" onclick={handleClickCreate} class="slds-m-left_x-small"></lightning-button>
            </template>
    
        </div>
        
    </template>
3
  • P.S. This is one of those times when you should have included your code. As it is, we have to guess why your data may not be refreshing.
    – sfdcfox
    Jul 24, 2022 at 12:08
  • Hi, sorry for that, I added everything
    – Ben2pop
    Jul 24, 2022 at 12:10
  • 1
    You have now a very comprehensive answer where before you would have only gotten a guess. Try to remember to include any relevant code when you have it, it makes a world of difference.
    – sfdcfox
    Jul 24, 2022 at 12:26

1 Answer 1

5

Instead of using Apex, use Lightning Data Service to get the data. This also demonstrates the use of importing field tokens, which are used for getRecord and getFieldValue. The magic of this code is that whenever the record is updated from the cache, your handleOpportunityData method will be called automatically.

    import { LightningElement, wire, api } from "lwc";
    import { getRecord, getFieldValue } from "lightning/uiRecordApi";
    import { NavigationMixin } from "lightning/navigation";
    import Related_Period_Id__c from "@salesforce/schema/Opportunity.Related_Period_Id__c";
    import Related_package_id__c from "@salesforce/schema/Opportunity.Related_package_id__c";
    import OpenPackageOnBo__c from "@salesforce/schema/Opportunity.OpenPackageOnBo__c";
    
    export default class OpenCreatePackagesOnBackOffice extends NavigationMixin(
      LightningElement
    ) {
      @api recordId;
      isBoth;
      isPackageOnly;
      isToCreate;
      isWeired;
      error;
      openPackageOnBo;
    
      @wire(getRecord, {
        recordId: "$recordId",
        fields: [Related_Period_Id__c, Related_package_id__c, OpenPackageOnBo__c],
      })
      handleOpportunityData(wireResult) {
        const { error, data } = wireResult;
        this.isBoth = false;
        this.isPackageOnly = false;
        this.isToCreate = false;
        this.isWeired = false;
        if (data) {
          const hasPackage = !!getFieldValue(data, Related_package_id__c);
          const hasPeriod = !!getFieldValue(data, Related_Period_Id__c);
          this.isBoth = hasPackage && hasPeriod;
          this.isisPackage = hasPackage && !hasPeriod;
          this.isToCreate = !hasPackage && !hasPeriod;
          this.isWeired = !hasPackage && hasPeriod;
          this.openPackageOnBo = getFieldValue(data, OpenPackageOnBo__c);
        }
        // If you need this, you should also show it somewhere.
        this.error = error;
      }
    
      handleClickOpenPackage() {
        const config = {
          type: "standard__webPage",
          attributes: {
            url: this.openPackageOnBo,
          },
        };
        this[NavigationMixin.Navigate](config);
      }
    }
1
  • Amazing I learnt something today ! Thx you very much ;)
    – Ben2pop
    Jul 24, 2022 at 13:00

You must log in to answer this question.

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