Add/Remove rows in Lightning Flow builder

Question

I am trying to achieve Add/Remove Rows in Lightning Flow.Currently I have added Add/Remove rows as Lightning Component in flow .But with this component users have to hit save button to save records.Is there a way to achieve this without hitting Save button like Finish button act like Save button.

Answer 1

So when your component implements the lightning:availableForFlowScreens interface you gain access to some Flow controls via an attribute called v.availableActions. Rather inconveniently, this is a List you must iterate to get available actions like so:

var availableActions = component.get('v.availableActions');
for (var i = 0; i < availableActions.length; i++) {
    if (availableActions[i] == "FINISH") {
        //just to set that the next button is a FINISH button
        component.set('v.complete',true); 
    }
}

Then use can remove the footer from the flow and use your Save button to control the flow via the v.navigateFlow attribute:

onClickNext : function(component,event,helper){
    if (component.get('v.complete')){
        var navigate = component.get("v.navigateFlow");
        navigate("FINISH");
    } else{
         var navigate = component.get("v.navigateFlow");
         navigate("NEXT");
    }
},

Optionally, you can use that v.complete attribute to change the Text in the button (Next vs Complete)