How do I set Dashboard Context string variable in Custom HTML widget to render another block in the same Dashboard?

Help
1

Hi,

I’m trying to set a Dashboard Context variable so that I can render another block which is making use of the same variable.

I’m setting this Dashboard context variable in my Custom HTML Widget
Name : ctx.filterStatus
Values would be Queued,InProgress

Now when I set the value of this context variable and force call the renderBlock() it shows me the updated value (console.log(Dashboard.input)) but the other Widget(DataTable) do not get updated based on the input change made.

Need help!

2

I’ve tried to understand information present in this link https://docs.losant.com/dashboards/blocks/custom-html/#accessing-data-using-javascript but still unable to figure out.

Would be helpful if there is a simple working example!

3

You can change a context variable’s value from within a Custom HTML Block by doing the following (a barebones proof of concept):

<input type="text" id="myInput" />
<button id="myButton">Click to Set</button>
<script>
  const CTX_VAR_NAME = 'string'; // the name of your context variable
  document.getElementById('myButton').addEventListener('click', () => {
    const ctxValue = document.getElementById('myInput').value;
    window.top.location.replace(`?ctx[${CTX_VAR_NAME}]=${ctxValue}`);
  });
</script>

This will trigger a full page refresh and will write that variable value to your URL. The security settings of the iframe do not provide access to the history.push API on the parent window, hence the required full page refresh. You will need to add more code to this to make it a workable example - i.e. setting the initial input value off the context variable; including the values of other context variables you have in the query string; and handling cases where the dashboard is used in the platform itself or in an Experience Dashboard Page.

The link you provided is good for form submissions that trigger changes elsewhere in your platform. For example, if you had a form that, on submit, changed the value of an Experience User tag, and then wanted that change to be reflected in other dashboard blocks post-submission, you could then call Dashboard.fetchData() when that initial request resolves and you would then see the update reflected in other blocks referencing that value.

2 Likes
4

Thanks, will try this solution.