1

Component 1

HTML:

<ui:inputText aura:id="Contact.LastName" value="{!v.contact.LastName}" change="{!c.handleInputChange}"/>

Controller:

handleInputChange: function(component, event, helper) {
    var m = helper.getLeadContactMappingFromClickEvent(event);
    var button = component.find('adopt-Lead.' + m.leadFieldName + '-button');
    button.set('v.iconName', 'action:close');
    helper.fireContactFieldsChangedEvent(component);
}

Helper:

// example of mapping string: 'Lead.Salutation:Contact.Salutation'
// is meant to be located on tr parent element of currently changing input
getLeadContactMappingFromClickEvent: function(event) {
    // goes up in DOM hierarchy and retrieves id of tr element
    // the id contains mapping between Lead field
    console.log('contact change event source', event.getSource());
    var mappingString = event.getSource().elements[0].parentElement.parentElement.id;
    var split = mappingString.split(':');
    return {
        leadFieldName: split[0].replace('Lead.', ''),
        contactFieldName: split[1].replace('Contact.', '')
    };
}

Results of console.log('contact change event source', event.getSource());

enter image description here


Component 2

HTML:

<ui:inputText aura:id="Account.Name" value="{!v.account.Name}" change="{!c.handleInputChange}"/>

Controller:

handleInputChange: function(component, event, helper) {
    var m = helper.getLeadAccountMappingFromClickEvent(event);
    var button = component.find('adopt-Lead.' + m.leadFieldName + '-button');
    if (button) {
        button.set('v.iconName', 'action:close');
    }
    helper.fireAccountFieldsChangedEvent(component);
}

Helper:

getLeadAccountMappingFromClickEvent: function(event) {
    console.log('account change event source', event.getSource());
    var mappingString = event.getSource().elements[0].parentElement.parentElement.id;
    var split = mappingString.split(':');
    return split.length > 1
        ? {
            leadFieldName: split[0].replace('Lead.', ''),
            accountFieldName: split[1].replace('Account.', '')
        }
        : {
            leadFieldName: null,
            accountFieldName: split[0].replace('Account.', '')
        };
}

Results of console.log('account change event source', event.getSource());

enter image description here

I'm trying to get the same event.getSource() data structure for 'Component 2' as I'm getting for 'Component 1'.

  • are they in two different org? – Himanshu Sep 21 '17 at 17:08
  • Same org. They are used in same wizard and are rendered dynamically with $A.createComponent(componentName, ..., depending on step. – Kiryl Kazlovich Sep 21 '17 at 19:12
2

My guess: This is due to different API Versions. Contact component is below API 40.0. The Account component is API v40 - which means the Account component gets Event Data as defined by the Locker Service.

To maintain functionality, either downgrade or rebuild Account cmp Locker Service compliant.

  • You are right, thank you. The Contact component bundle is API v38.0, Account: v40.0. I'm experimenting with a different solution rather than trying to get .parentElement.parentElement. I think I can achieve similar results with simple event bubbling – Kiryl Kazlovich Sep 21 '17 at 21:16

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.