Aura component force:recordData picklist onchange event

Question

I have the following markup component:

<aura:component extends="c:GenericLightningAuraComponent" 
                implements="force:lightningQuickActionWithoutHeader,force:hasRecordId"
                controller="MyController">
    <aura:handler name="init" value="this" action="{!c.doInit}"/>
    <force:recordData layoutType="FULL"
                      recordId="{!v.recordId}"
                      targetFields="{!v.record}"
                      recordUpdated="{!c.recordUpdate}" />
</aura:component>

The following aura component uses specific custom object called .

The Revenue__c custom object has several picklist custom fields:

Picklist A
Picklist B
Picklist C
...

I need to handle the onchange event of the first Picklist A and to call function in JS client controller i.e. in the corresponding .js file. The idea is to change the value in Picklist B.

All examples I've found have <lightning:select or <lightning:inputField tags.

In my case how can I access Picklist A and to add an onchange event to the Picklist A?

I've tried with

recordUpdate : function(component, event, helper) {
        var changeType = event.getParams().changeType;
        if (changeType === "ERROR") { alert('alert ERROR'); }
        else if (changeType === "LOADED") { alert('alert LOADED '); }
        else if (changeType === "REMOVED") { alert('alert REMOVED '); }
        else if (changeType === "CHANGED") { alert('alert CHANGED'); }
}

I've changed the value in Picklist A but the alert is not visible. All I see is the alert in if (changeType === "LOADED") { alert('alert LOADED '); }
Please explain to make the alert visible in if (changeType === "CHANGED") { alert('alert CHANGED '); }?

Answer 1

You can make use of recordUpdated available in force:recordData, which is fired when the record is loaded, updated, or deleted. The event returns two parameter:-

1. changedFields - The fields that are updated on the record when the changeType is "CHANGED".
2. changeType - The type of change that fired the event, with values corresponding to "ERROR, "LOADED", "REMOVED", or "CHANGED".

Sample example:-

<force:recordData aura:id="forceRecord"
    recordId="{!v.recordId}"
    fields="Name,Title,Email"
    targetRecord="{!v._record}"
    targetFields="{!v.simpleRecord}"
    targetError="{!v._error}"
    recordUpdated="{!c.recordUpdated}" />

---

({
  recordUpdated: function(component, event, helper) {
 
    var changeType = event.getParams().changeType;
 
    if (changeType === "ERROR") { /* handle error; do this first! */ }
    else if (changeType === "LOADED") { /* handle record load */ }
    else if (changeType === "REMOVED") { /* handle record removal */ }
    else if (changeType === "CHANGED") { /* handle record change */ }
})

Read more here:- Record Change