4

I have an appHostable component that I exposed as custom lightning component tab and added to one of my lightning applicaitons (lightning nav bar). The component is trying to use force:editRecord event to open edit form, make changes to the record, save and find out when the dialog is closed. Using the code below I managed to open the edit form and save changes, however I cannot find the way to update my screen when this is done. Does anyone know how to do it correctly?

Here is a very simple component:

<aura:component implements="force:appHostable" >

    <aura:handler event="force:refreshView" action="{! c.viewRefreshed }" />
    <aura:dependency resource="markup://force:editRecord" type="EVENT" />
    <c:SLDSButton label="Edit Account" onclick="{! c.editAccount }" />

</aura:component>

and js controller:

({
    viewRefreshed: function( cmp, evt, h ) {
        console.log('view refreshed!');
    },

    editAccount: function( cmp, evt,  h ) {
        $A.get('e.force:editRecord').setParams({ recordId: '0015800000EVo8nAAD' }).fire();
    }
})

Substitute the ID of the Account with a real account id in your test org to make it working.

Upon saving the account, I expect to see the 'view refreshed!' message in console so that I could perform necessary actions but nothing happens.

1

1 Answer 1

2

If you really care about the save event only, then you need to attach a handler for the force:recordSaveSuccess that is being fired, once the framework successfully saves the record in the database.

It seems like force:recordSaveSuccess event in not handled in home page, well handling the toast event force:showToast might work for your case.

<aura:component implements="force:appHostable" >
    <! -- did not work for home page -->
    <aura:handler name="onSaveSuccess" event="force:recordSaveSuccess" action="{!c.viewRefreshed}"/>
    <aura:handler event="force:showToast" action="{! c.viewRefreshed}" />
    <aura:dependency resource="markup://force:editRecord" type="EVENT" />
    <c:SLDSButton label="Edit Account" onclick="{! c.editAccount }" />
</aura:component>

But if you need a bit more control over the actions like cancel,save then use <force:editRecord /> in your custom slds modal and wire up your own custom cancel and save button actions.

Eg:

component:

<aura:component>
    <aura:attribute name="recordId" type="String" default="a02D0000006V8Ni"/>
    <aura:attribute name="saveState" type="String" default="UNSAVED" />
    <aura:handler name="onSaveSuccess" event="force:recordSaveSuccess" action="{!c.handleSaveSuccess}"/>

    <c:sldsModal aura:id="modal">
        <force:recordEdit aura:id="edit" recordId="{!v.recordId}" />
        <ui:button label="Save" press="{!c.save}"/>
        <ui:button label="Cancel" press="{!c.cancel}"/>
    </c:sldsmodal>

</aura:component>

controller.js:

({
    save : function(cmp, event) {
        // Save the record
        cmp.find("edit").get("e.recordSave").fire();
    },

    handleSaveSuccess : function(cmp, event) {
        // get called once save is done
    },

    cancel : function(cmp, event) {
        // hide the slds modal
    },

})
8
  • I have modified the component to use recordSaveSuccess event but the viewRefreshed function still is not called upon saving changes.
    – Artur
    Commented Dec 7, 2016 at 18:15
  • are you getting the toast message after save?
    – Praveen
    Commented Dec 7, 2016 at 18:27
  • @Artur I have updated the answer. check it out?
    – Praveen
    Commented Dec 7, 2016 at 18:40
  • 1
    You are using force:recordEdit component, not force:editRecord event as per my original post. My aim is to avoid re-creating what is otherwise already provided by the framework as much as possible. The force:editRecord event takes care of the environment it is invoked in - so the rendered UI is slightly different in Salesforce1 and LEX on desktop. I understand it is possible to recreate all of that but is counter productive considering it is already implemented.
    – Artur
    Commented Dec 7, 2016 at 19:14
  • 1
    @Artur I understand what you are saying. BTW, did you try adding handler to the force:showToast like I mentioned in answer ?.
    – Praveen
    Commented Dec 7, 2016 at 19:16

You must log in to answer this question.

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