Calling a var from an html Widget

Using JavaScript with Hype
1

for the life of me I can’t seem to figure out how to call a variable from a form I inserted into an html widget and/or a rectangle. I have tried a few suggestions but nothing seems to work. Variable “TestVar” is set in the form via an html widget. When it is set I want its result to show in a text box with an Id called “myVar” using the var bob. I know it is goofy but I am just trying to get my head wrapped around this.

Some of the code I Am currently using is as follows.

//var bob = hypeDocument.getElementById(‘TestVar’);
var iframe= hypeDocument.getElementById(‘theWidget’).children[0];
console.log(iframe);

var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;

var bob = iframeDocument.getElementById(‘TestVar’)

hypeDocument.getElementById(‘myVar’).innerHTML = bob;`

2

For iframes (and HTML Widgets), a parent cannot grab values from a child; this is a security violation. You’d need a bit more javascript to do that. The easier method is putting the form in the inner html of a rectangle.

Here’s a quick sample document showing how to take a value out of an input text field and populate another box with it:

FormCopy.hype.zip (14.7 KB)

The code I’m using looks like this:

var textFieldValue = document.forms["myForm"].elements["myTextField"].value;
hypeDocument.getElementById("outputBox").innerHTML = textFieldValue;

(there’s of course many different ways to access the value)