Accessing Excel variable using JavaScript and inserting into video url

#1

Dear Will,

Good evening. I am writing to learn whether FORIO has documentation related to extracting excel variable? It appears to me whenever I try data-f-bind it show properly on HTML page. But I cannot get the same variable when I am trying to get element’s content by ID/TAG/Class, etc.
For example:
I want to get the value of variable “Story_Content” or cell “C301”.
< span id=“test” data-f-bind=“Story_Content” data-flow-error=“Could not find world”>< span>
let x = document.getElementById(“test”).innerHTML;
console.log(x);
I cannot see innerHTML value or any text content. I would be very grateful if a small example could be provided on how to do it. I am basically trying to insert the variable located in Excel cell into youtube url. But since I cannot see innerHTML value of the element, I cannot achieve this.

With kind regards,
Akbar

#2

Hi –

To answer your question directly, your JavaScript code can get the value of an Excel variable through the Flow.js variable channel. Specifically, you subscribe to a variable and get a callback when it changes. See
https://forio.com/epicenter/docs/public/data_binding_flow_js/generated/channels/variables-channel/

However, a better way to do this might be to use a converter. This is a Flow JS technique which takes a variable, gets the value and changes the output. Typically converters are used for things like number formatting, but in this case it builds the full URL.

For example, if you wanted to have a dynamic hyperlink (where 1000 is from the variable “score”)
https://example.com/path/1000.html

Put this in your index.html file
<script>
Flow.dom.converters.register('buildUrl', function (val) {
return "https://example.com/" + val + ".html";
}, false);
</script>

In your web page, include this link
<a data-f-href="score | buildUrl">click here to go to link</a>

Breaking this down

  • putting ‘data-f’ before any HTML attribute sets it dynamically with flow js
  • including ‘score’ retrieves the variable score from your model
  • including a pipe and then buildUrl calls the converter to generate the URL.

More info on converters are here:
https://forio.com/epicenter/docs/public/data_binding_flow_js/generated/converters/converter-manager/

#3

Dear Will,

Thank you very much for your instant support. I found the answer here:
https://forio.com/epicenter/docs/public/api_adapters/generated/variables-api-service/

One more question though - I could not find expression for variable.current step in Epicenter.js.

Sorry for being off topic.

With kind regards,
Akbar

#4

Terrific.

The variable is “Step” or “Time”.

WILL

#5

Dear Will,

Thank you. I meant for current step of the variable. Apologize for misunderstanding.

With kind regards,
Akbar