0

Problem: I create a record when a user enter a value in the Return To Sender field. What i'm trying to do, is only display the data if the record exists and has the same doNbr as the one already on the page (the DO # displayed on the page is not stored on SF). But right now, if I enter a value on the field, it displays on every package section no depending on the doNbr like I want. Please find a screenshot of the page: enter image description here

When creating the record, I retrieve the doNbr, and save it on a doNbr field on the object. It works fine as you can see from the screenshot below.

enter image description here

Js file:

import { LightningElement, track, api, wire } from 'lwc';
import getCustomerOrder from '@salesforce/apex/icCTRLCustomerOrder.getCustomerOrder';
import getPackageByOrderId from '@salesforce/apex/icCTRLCustomerOrder.getPackageByOrderId';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import { createRecord, updateRecord } from 'lightning/uiRecordApi';
import RETURN_OBJECT from '@salesforce/schema/Return_to_Sender__c';
import ORDER_FIELD from '@salesforce/schema/Return_to_Sender__c.Order__c';
import DO_NUM_FIELD from '@salesforce/schema/Return_to_Sender__c.Do_Nbr__c';
import RETURN_TO_SENDER_FIELD from '@salesforce/schema/Return_to_Sender__c.Tech_Return_To_Sender__c';
import ORDER_RETURN_TO_SENDER_FIELD from '@salesforce/schema/Order.Return_To_Sender__c';
import ORDER_ID_FIELD from '@salesforce/schema/Order.Id';

export default class IcPackageInformation extends LightningElement {
@track displayPopup = false;
@track doDetails;
@track tempdoNum = [];
@track inputFilled = false;
@track doNum;
@track packageSaved = false;
@api orderId;
@track trackNumber;
@api returnToSenderStored; 

package;
error;
packageId;
returnToSender = '';
record;
doNumReturn;
returnSaved;
returnRep;


@wire(getPackageByOrderId, { recordId: '$packageId'})
wiredPackage({ error, data }) {
if (data) {
    this.returnSaved = data.Do_Nbr__c; 

} else if (error) {
    console.log('Something went wrong:', error);
}
}


handleReturnToSenderChange(event) {
    this.packageId = undefined;
    this.doNumReturn = undefined;
    this.returnToSender = event.target.value;
    this.inputFilled = true;

    let index = event.target.dataset.index;

    this.doNum =  this.tempdoNum[index];


}

handleTrackingNumber(event) {
    this.packageId = undefined;
    this.trackNumber = event.target.value;
    this.inputFilled = true;
}

createPackage() {
    const fields = {};

    fields[RETURN_TO_SENDER_FIELD.fieldApiName] = this.returnToSender;
    fields[ORDER_FIELD.fieldApiName] = this.orderId;
    fields[DO_NUM_FIELD.fieldApiName] = this.doNum;
    
    const recordInput = { apiName: RETURN_OBJECT.objectApiName, fields };
    createRecord(recordInput)
        .then(package__c => {
            this.packageId = package__c.id;
            this.doNumReturn = package__c.Do_Nbr__c;

            this.packageSaved = true;               
            const orderFields = {};

        
        this.inputFilled = false;

        orderFields[ORDER_RETURN_TO_SENDER_FIELD.fieldApiName] = this.packageId;
        orderFields[ORDER_ID_FIELD.fieldApiName] = this.orderId;

const recordOrder = {
  fields: orderFields
  
};

updateRecord(recordOrder).then((record) => {
  console.log('record ', record);
});
        })
    
        .catch(error => {
            this.dispatchEvent(
                new ShowToastEvent({
                    title: 'Error creating record',
                    message: error.body.message,
                    variant: 'error',
                }),
            );
        });       
    }


handleCancel(event){
    this.inputFilled = false;

}

connectedCallback(){
    this.fetchOrderDetails();

}
fetchOrderDetails(){
    let customerOrderNumber = this.customerOrderNumber;

    getCustomerOrder({customerOrderNumber:customerOrderNumber})
    .then(data => {
      
        this.doDetails = data.doDetails;
        
        this.doDetails.forEach(doDetail =>{

            this.tempdoNum.push(doDetail.doNbr);
            

                })

    }).catch(error => {
        window.console.log('callout error ', JSON.stringify(error));

    })

}

}

HTML file:

   <div class="slds-form__row">
        <div class="slds-form__item" role="listitem">
          <div class="slds-form-element slds-form-element_readonly slds-form-element_horizontal slds-hint-parent">
            <span class="slds-form-element__label">
                DO #</span>
            <div class="slds-form-element__control">
              <div class="slds-form-element__static" name="doNbr" >
                {doDetail.doNbr}
              </div>
            </div>
          </div>
        </div>
        <div class="slds-form__item" role="listitem">
          <div class="slds-form-element slds-form-element_readonly slds-form-element_horizontal slds-hint-parent">
            <span class="slds-form-element__label">Return to Sender</span>
            <div class="slds-form-element__control">
              <div class="slds-form-element__static">
               <template if:false={returnToSenderStored}>
                <lightning-input data-index={index} field-name='ReturnToSender' onchange={handleReturnToSenderChange} value=''>
                  </lightning-input>
              </template>

              <template if:true={returnToSenderStored}>
                <lightning-input data-index={index} field-name='ReturnToSender' onchange={handleReturnToSenderChange} value={returnToSenderStored}></lightning-input>
              </template>

              </div>
            </div>
          </div>
        </div>
 
      </div>

Apex class:

       @AuraEnabled(cacheable=true)
 public static Return_To_Sender__c getPackageByOrderId(Id recordId) {
    return [SELECT Id, Do_Nbr__c, Tech_return_to_sender__c 
    FROM Return_To_Sender__c
    WHERE Id = :recordId ];
 
  }
3
  • were you able to resolve this?
    – glls
    Commented Aug 19, 2021 at 18:47
  • hi, sort of! If I put "Yes" on package A and then "No" on package B, it will work as intended, and I will the see the values in the right place. However, if I put "Yes" on package A but nothing on package B, "Yes" will be displayed in both packages. I'll update my post with the code though
    – chloe
    Commented Aug 24, 2021 at 16:09
  • please open a new question instead =)
    – glls
    Commented Aug 24, 2021 at 16:15

1 Answer 1

1

you are just pushing data into your array without removing/checking for duplicates.

I would recommend you change your approach.

declare a property which contains an array of objects which corresponds to each of the order's.

in your template, you can iterate over your property to display each of the orders and from the "input" fields, modify the objects in the property directly. this will avoid you the headache of having to check for the "index" of the item in the array to either update or add.

example:

orderProperty = [{Id: '123213213, Do_Nbr__c: '123123}] //(can include more)

you can then use a template directive for:each={array} to iterate and render your order data.

and when you change or update your <lightning-input> element, using handleReturnToSenderChange, instead of checking for the index value: let index = event.target.dataset.index; you can use Array.prototype.find() method to find the object corresponding to your order number and modify the value.

You must log in to answer this question.

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