Calling a Flow Action from an onClick button on a UI page

[cnharris1]

Good afternoon developers,

I have a custom ui page that is displaying data to the user (This part is working fine).

I also created a button on that custom ui page to call a flow action to revalidate the data (This part is not working at all).

Is it possible to call a flow action from an onClick button on a custom UI page? If so, could you provide examples? If not, are there alternative solutions?

Any help will be greatly appreciated!

Best regards,

cnharris1

[DYCM · Accepted solution]

Hi @cnharris1 ,

Yes, you can call Flow Designer Action from an button in UI page. Here is the demo for you. 

Create a simple UI Page for testing:

The code snippet in HTML:

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
	<g:ui_form>
		<input type="text" id="yourData" name="yourData" />
		<button>Your Button</button>
	</g:ui_form>
</j:jelly>

The code snippet in Processing script:

gs.info(">>>DEBUG: Your Data: " + request.getParameter("yourData"));
try {
    var inputs = {};
    inputs['yourdata'] = request.getParameter("yourData"); // String 

    // Start Asynchronously: Uncomment to run in background. Code snippet will not have access to outputs.
    // sn_fd.FlowAPI.getRunner().action('global.revalidate_data').inBackground().withInputs(inputs).run();

    // Execute Synchronously: Run in foreground. Code snippet has access to outputs.
    var result = sn_fd.FlowAPI.getRunner().action('global.revalidate_data').inForeground().withInputs(inputs).run();
    var outputs = result.getOutputs();

    // Get Outputs:
    // Note: outputs can only be retrieved when executing synchronously.
    var isvalid = outputs['isvalid']; // True/False
	gs.info(">>>DEBUG: Is Valid: "+isvalid);

} catch (ex) {
    var message = ex.getMessage();
    gs.error(message);
}

The Flow Designer Action is simple too, it accepts "yourData" as input parameter, and "isvalid" is the output. When "yourData" is "abc123" the "invalid" is true, otherwise it will be set to false.

A tip is that after your action is ready and published, you can use "Create code snippet" to get the code for calling this Action.

Please refer to this article for more details of Scripting with Flows, Subflows, and Actions:

https://developer.servicenow.com/dev.do#!/learn/learning-plans/utah/servicenow_application_developer...

[cnharris1]

Thank you @DYCM for your quick response! 

That information was very helpful! I recreated your test ui page and action in my own instance and it worked as expected!

[DYCM]

Great, glad to know it's working 🙂

[JuneR]

I don't know what I am doing wrong but I followed your instructions several times and I am still getting that my output is "undefined".  My action is "Revalidate Data". Should that be one word ? This is my code... 

gs.info(">>>DEBUG: Your Data: " + request.getParameter("yourData"));

try {

    var inputs = {};

    inputs['yourdata'] = request.getParameter("yourData"); // String

    // Start Asynchronously: Uncomment to run in background. Code snippet will not have access to outputs.

    // sn_fd.FlowAPI.getRunner().action('global.revalidate_data').inBackground().withInputs(inputs).run();

    // Execute Synchronously: Run in foreground. Code snippet has access to outputs.

    var result = sn_fd.FlowAPI.getRunner().action('global.revalidate_data').inForeground().withInputs(inputs).run();

    var outputs = result.getOutputs();

    // Get Outputs:

    // Note: outputs can only be retrieved when executing synchronously.

    var isvalid = outputs['isvalid']; // True/False

    gs.info(">>>DEBUG: Is Valid: "+isvalid);

gs.addInfoMessage(isvalid);

} catch (ex) {

    var message = ex.getMessage();

    gs.error(message);

}

Please help.