How to Call Client Side Scripting with AI

Imagine a scenario where you are interacting with an AI chat bot within m-Power. Then, based on the AI response, you want to invoke client side scripting, based on the response. This document will show you how to do this.

Overview

Each and every time the AI Assistant responds, m-Power will attempt to call a JavaScript function by the name of aiResponseCallback.

If it exists on the page, the function will be invoked.

If the function doesn’t exist, it will be skipped.

Below you will find a barebones example of the function that will return a JavaScript alert each time the AI Assistant responds.

The Code

<script>
	function aiResponseCallback(response, message, data){
          alert("Your Function has been Called");  
        }
</script>

In-Depth Example

Having understood the basic example, let’s expand more on some of the pieces and parts of this function for a more in-depth example. More information regarding mapping parameters within the AI Assistant can be found here.

Imagine you have configured your AI Assistant, through prompts and parameters to return a JSON response. Specifically, imagine you have built an AI Assistant to help users add items to their cart. Once they find the item they want, you ask the AI Assistant to return a JSON response that can then be read in by Workflow to write to the database. After doing this, you may want to alert the user that their cart has been updated.

First, I set up a variety of parameters within my AI Assistant:

Notice I have created an action parameter. This is very important for me as my AI assistant is flexible enough to add items, update, or remove items from my cart. It is the “action” parameter that will house the value for what I am trying to accomplish.

Next, I lay out within my prompt how I want my JSON response to look.

Notice the action is listed as “add”

Having detailed all the above, now it is time to add my JavaScript to my AI assistant.

<script>
function aiResponseCallback(response, message, data){
    if (data.action == 'add'){
      alert("Cart has been updated")
    }
}
</script>

Notice that while the aiResponseCallback function will still be called every time there is a response from the AI assistant, it won’t display the alert until the action parameter, within the data object, is being sent as “add”.

You can look for the value of any parameter returned from the AI Assistant. All you need to do is to declare the parameter within the app, set it within a JSON response within the system prompt, then check for it within the JavaScript