1

I have a lightning recordEditForm that does what I need it to do. However I cannot get the controller correct. At this point after the user enters a few fields and hits "create record" the record is created but I don't get taken to the new record. I would like either a toast or preferably to be taken to the new record. Any help is appreciated. Thanks

Component

<aura:component implements="lightning:actionOverride">
        <lightning:recordEditForm aura:id="newLeadForm" 
                           objectApiName="Lead">
        <lightning:messages />
        <lightning:inputField fieldName="Name" />
            <lightning:inputField fieldName="Phone" />
            <lightning:inputField fieldName="Email" />
            <lightning:inputField fieldName="Company" />
        <lightning:button class="slds-m-top_small" type="submit" label="Create new" />
    </lightning:recordEditForm>
</aura:component>

Controller

({
    handleLoad : function(component, event, helper) {
        console.log('handle handleLoad');
        component.set("v.showSpinner", false);
    },
    handleSubmit : function(component, event, helper) {
        event.preventDefault(); // Prevent default submit
        var fields = event.getParam("fields");

        component.find('newLeadForm').submit(fields); // Submit form
        console.log('handle handleSubmit');
    },
    handleSuccess : function(component, event, helper) {
        console.log('record updated successfully');


        component.set("v.showSpinner", false);
    },
})

1 Answer 1

1

lightning:recordEditForm does not automatically navigate to newly created record.

You can use force:showToast for toast message and force:navigateToSObject to navigate to newly create object.


For this to work, you need to bind the submit and success methods in recordEditForm defined in the component as:

<lightning:recordEditForm aura:id="newLeadForm" 
    objectApiName="Lead"
    onsubmit="{!c.handleSubmit}"
    onsuccess="{!c.handleSuccess}">

Finally you need to add toast and navigation in your handleSuccess method of controller or helper JS as:

handleSubmit : function(component, event, helper) {
    // your existing code
},
handleSuccess: function(component, event, helper) {

    // stop spinner 
    component.set("v.showSpinner", false);

    // Show toast
    var toastEvent = $A.get("e.force:showToast");
    toastEvent.setParams({
        "type": "success",
        "title": "Success!",
        "message": "Lead record has been created successfully."
    });
    toastEvent.fire();

    // 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();
}

You must log in to answer this question.

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