Editing CSV Records in a Form

Last Updated: 08/11/2016 Introduced in Verision: 2.0

The CSV Editor form component allows for the editing of CSV-formatted tabular data, such as a spreadsheet.

To use the CSV Editor in a flow, first create a form in the Form Designer and drag the CSV Editor component to the workspace from the File Handling category of the Toolbox panel. Then, in the Flow Designer, configure the data inputs and outputs of the form step.

Example

This example will create a form containing a CSV Editor, then create a flow that maps the inputs and outputs of the form.

Begin in the portal by navigating to a Designer Folder and clicking the Create Form button. In the resulting New Form pop-up, name the form and click OK to open it in the Form Designer.

nameForm

 

Drag a CSV Editor component to the workspace from the File Handling category of the Toolbox panel. Expand the form.

dragCSVEditor

 
 
Under the Properties panel, configure the CSV Editor component as follows:
csvEditorProperties 
 
 
If the form does not already have a button, add a Button component to the workspace.
 
This completes our form. Save and close the Form Designer.

Back in the Designer Folder, click the New Flow button. In the resulting New Flow pop-up, give a name to the flow and click OK to open it in the Flow Designer.

nameFlow

 
 
Add the CSV Editing form in our flow by dragging CSV Form to the workspace from the Flows, Rules, Forms and Reports > Forms [Interaction] > [Current Folder] category of the Flow Designer’s start-up window. Click Add to add this step to the workspace.
 
 flowStarts

Next, click in the workspace so that when the Properties panel is selected, the Flow Data input option appears. In the Properties panel, under Flow Data > Flow Input Data, click the Add button.

addFlowInputData

 

In the resulting Edit object pop-up, enter “CSVFile” in the Name field and click the Type selector. Select the type FileData and click OK.

We’ll save the input type by clicking the Save button in the Edit object pop-up .

defineInputData

 

Next, click on the form step and, in the Properties panel, click the Show Mapping Editor link, or select the option from the step’s Action menu.

showMappingForForm

 

In the Mapping Editor, map the flow’s data input – Csv file – to our form’s data input – Csv file, and click OK to close the Mapping Editor.

mappingForForm

 
 
Connect the form to the End step.
 
This completes our example flow. Click the Debug Flow link to see it in action.

Note that in Decisions version 3.5 and above, you’ll need to click on Test Flow to access the Debugger.

3.5 Test Flow Shot

 
The Debugger prompts for a file to use as input.
 pickTheFile
 
 
Click the CSVFile selector and, in the resulting Open pop-up, select the file and then click Open.
 
Click the Run without Save button to run our flow in the debugger.

The CSV Form appears under the Form tab. To edit the data, click any cell in the table.

runningDebug

 

To add a new row, click one of the Add Row buttons.

 
insertAfter 
 
To save the updated CSV file, click the Save Excel File button.
 
In the resulting Save As pop-up, give a name to the new CSV file and click Save.
saveFile
 
 

Additional Resources