lightning:recordEditForm - Set or modify field values onsubmit

  • I have created a lightning component which allows the creation of a record in a custom object. I've used lightning:recordEditForm to capture the data, and to help the user it automatically populates some fields on the custom object in the background when they submit the form.

    <lightning:recordEditForm objectApiName="Object__c" onsubmit="{!c.onRecordSubmit}" onsuccess="{!c.onRecordSuccess}">
        <lightning:inputField fieldName="Name" />
        <lightning:button variant="brand" label="Save" type="submit" />
    </lightning:recordEditForm>
    

    When the user clicks submit, my logic sets a field value in the background (Field__c in this case), and then on a successful save redirects to the new record.

    onRecordSubmit: function(component, event, helper) {
    
        var eventFields = event.getParam("fields");
        eventFields["Field__c"] = "Test Value";
        event.setParam("fields", eventFields);
    },
    onRecordSuccess: function(component, event, helper) {
        //navigate to new record on successful save
        var navEvt = $A.get("e.force:navigateToSObject");
        navEvt.setParams({
            "recordId": event.getParam("response").id,
            "slideDevName": "detail"
        });
        navEvt.fire();
    }
    

    This was working fine until this week (I think today 19/07), when we noticed that the field values being set in javascript were no longer being persisted in the newly created record. Is this an issue with Salesforce?

    What API version is the component using? Try changing it to 37 if possible and see if that resolves the issue

    It's on v43 and has been since Summer 18 was released. It's not possible to save v37 as lightning:recordEditForm requires v41. Can I ask why you suggest this?

    Ahh lightning locker service sometimes can have negative affects on older components if it is enabled i.e 38 and greater api.

    What if you add `Field__c` in the markup but hide it with CSS... does that help? And if not, maybe you could manipulate the `value` attribute of that field directly.

    Thanks for the input @CharlesT. As a workaround I can add the fields as hidden, replace the submit button with my own method which sets the field values, and then call submit() on the recordEditForm. Unfortunately this comes up against a new issue - it doesn't work for Picklist fields! Still don't get why it all worked until this week :(

    I suppose another option is to use Lightning Data Service. A bit more script to write but you have more control over what happens.

    @CharlesT That was my next fallback, but Stephen's answer below has solved it for me.

  • This is not the correct api for setting form values via javascript. It happened to work before, but that was not the supported api. The correct way to do this is this:

    <lightning:recordEditForm
         aura:id="myform"
         objectApiName="Object__c" 
         onsubmit="{!c.onRecordSubmit}" 
         onsuccess="{!c.onRecordSuccess}">
      <lightning:inputField fieldName="Name" />
      <lightning:button variant="brand" label="Save" type="submit" />
    </lightning:recordEditForm>
    

    controller:

    onRecordSubmit: function(component, event, helper) {
      event.preventDefault(); // stop form submission
      var eventFields = event.getParam("fields");
      eventFields["Field__c"] = "Test Value";
      component.find('myform').submit(eventFields);
    },
    

    I don't think this results in the onsuccess being called does it?

License under CC-BY-SA with attribution


Content dated before 7/24/2021 11:53 AM