IE Engine APIs

The IE engine uses MSHTML and returns a live DOM document.

• showHTMLForm(url, params) – shows an HTML form and returns its MSHTML document.
• launchHTMLForm(url, params) – shows an HTML form in a separate window.
• loadHTMLDocument(url, params) – loads an HTML document without showing a form.

Example (JScript / JavaScriptV8 via SetupJS)

// Get GUI file path
var filePathGUI = getGUIFilePath("SampleScreen.htm");

// Show IE HTML form
var doc = showHTMLForm(filePathGUI, null);

if (doc != null)
{
    var value = doc.forms[0]["txtInput"].value;
    writeln("User entered: " + value);
}
    

Edge Engine APIs

The Edge engine uses WebView2 and returns a composite object when you call showHTMLFormEdge(), launchHTMLFormEdge(), or loadHTMLDocumentEdge().

• showHTMLFormEdge(url, script, params)
• launchHTMLFormEdge(url, script, params)
• loadHTMLDocumentEdge(url, script, params)

The return object has two key properties:

var htmlData = showHTMLFormEdge(url, script, params);

// HtmlAgilityPack document
htmlData.Document

// JavaScript State array
htmlData.State
    

• Document – a HtmlAgilityPack HTML document snapshot.
• State – a JavaScript array describing each control (id, name, type, value, checked, options, etc.).

You can choose either model depending on your needs: Document for HTML‑centric parsing, or State for control‑centric access.

Edge Engine – HtmlAgilityPack Document Access

The htmlData.Document property is a HtmlAgilityPack document. You access nodes using DocumentNode.SelectSingleNode, SelectNodes, and GetAttributeValue.

Helper: Get value by id

function getHtmlCtrlValue(doc, id){
    var node = doc.DocumentNode.SelectSingleNode("//*[@id='" + id + "']");
    if (node == null) return "";

    // First try the value attribute (for inputs)
    var returnValue = node.GetAttributeValue("value", "");

    // If empty, fall back to InnerText (for textarea, div, span, etc.)
    if (returnValue == null || returnValue.length == 0) {
        returnValue = node.InnerText;
    }

    return returnValue;
}
    

Helper: Get selected radio button value by group name

function getHtmlRadioBtnCtrlValue(doc, ctrlName) {
    if (!doc || !ctrlName) return "";

    const radios = doc.DocumentNode.SelectNodes(
        "//input[@type='radio' and @name='" + ctrlName + "']"
    );

    if (!radios || radios.length === 0)
        return "";

    for (const r of radios) {
        // Boolean attribute detection that works with hosted .NET objects
        if (r.Attributes && ("checked" in r.Attributes)) {
            return r.GetAttributeValue("value", "");
        }
    }

    // If none explicitly checked, default is first radio
    return radios[0].GetAttributeValue("value", "");
}
    

Example: Using HtmlAgilityPack Document

// Get GUI file path
var filePathGUI = getGUIFilePath("UserInteraction.html");

// Show Edge Web GUI
var htmlData = showHTMLFormEdge(filePathGUI, '', {}); 

if (htmlData != null && htmlData.Document != null)
{
    var doc = htmlData.Document;

    var name      = getHtmlCtrlValue(doc, "txtName");
    var ageGroup  = getHtmlCtrlValue(doc, "ddlAgeGroup");
    var gender    = getHtmlRadioBtnCtrlValue(doc, "rbGender");
    var resume    = getHtmlCtrlValue(doc, "flResume");

    if (!resume || resume.length === 0)
        resume = "N/A";

    writeln("You have selected (HtmlAgilityPack):");
    writeln("");
    writeln("Name: " + name);
    writeln("Age Group: " + ageGroup);
    writeln("Gender: " + gender);
    writeln("Resume: " + resume);
}
    

Edge Engine – State Array Access

The htmlData.State property is a JavaScript array of control descriptors. Each element typically includes id, name, type, value, checked, and options (for selects).

Helper: Get element by id

function getElementById(state, id){
    return state.find(x => x.id === id) || null;
}
    

Helper: Get value by id

function getValueById(state, id) {
    const el = state.find(x => x.id === id);
    if (!el) return null;

    // Radio/checkbox: return checked state or value
    if (el.type === "checkbox" || el.type === "radio") {
        return el.checked ? el.value : null;
    }

    // Textbox, textarea, select, etc.
    return el.value;
}
    

Helper: Is control checked

function isControlChecked(state, id){
    const el = state.find(x => x.id === id);
    if (!el) return null;

    if (el.type === "checkbox" || el.type === "radio") {
        return el.checked;
    }

    return null;
}
    

Helper: Get selected radio button value by group name

function getSelectedRadioButtonValue(state, groupName) {

    // Find the radio element with the given name that is checked
    const selected = state.find(el =>
        el.type === "radio" &&
        el.name === groupName &&
        el.checked === true
    );

    return selected ? selected.value : null;
}
    

Full Example: Using State Array

/*
This example shows how to get values from Edge HTML Web Form using State array
*/

function getElementById(state, id){
    var returnValue = null;
    returnValue = state.find(x => x.id === id);
    return returnValue;
}

function getValueById(state, id) {
    const el = state.find(x => x.id === id);
    if (!el) return null;

    if (el.type === "checkbox" || el.type === "radio") {
        return el.checked ? el.value : null;
    }

    return el.value;
}

function isControlChecked(state, id){
    var returnValue = null;

    const el = state.find(x => x.id === id);
    if (!el) return null;

    if (el.type === "checkbox" || el.type === "radio") {
        returnValue = el.checked;
    }

    return returnValue;
}

function getSelectedRadioButtonValue(state, groupName) {
    const selected = state.find(el =>
        el.type === "radio" &&
        el.name === groupName &&
        el.checked === true
    );

    return selected ? selected.value : null;
}

// Get GUI file path
var filePathGUI = getGUIFilePath("UserInteraction.html");

// Show WEB GUI 
var htmlData = showHTMLFormEdge(filePathGUI,'',{}); //returns HTML Data

//Declare variables
var name = '';
var ageGroup = '';
var gender = '';
var bMarried = false;
var resumePath = '';
var skills = [];

if (htmlData != null && htmlData.State != null)
{
    name      = getValueById(htmlData.State, "txtName");
    ageGroup  = getValueById(htmlData.State, "ddlAgeGroup");
    gender    = getSelectedRadioButtonValue(htmlData.State, "rbGender");
    bMarried  = isControlChecked(htmlData.State, "chkMarried");
    resumePath = getValueById(htmlData.State, "flResume");

    if(resumePath == null || resumePath === undefined || resumePath.length == 0)
    {
        resumePath = 'N/A';
    }

    var ctrl = getElementById(htmlData.State,"lstSkills");

    for(var o of ctrl.options)
    {
        if (o.selected)
        {
            skills.push(o.value);
        }
    }
}

//Generate output 
writeln("You have selected:");
writeln("");

write('Name: ');
writeln(name);

write('Age Group: ');
writeln(ageGroup);

write('Gender: ');
writeln(gender);

write('Married?: ');
writeln(bMarried);

write('Resume: ');
writeln(resumePath);

writeln('Skills: ');
for(var o in skills)
{
    writeln(skills[o]);
}
    

Choosing Between Document and State

• Use Document when you want to parse HTML structure, work with arbitrary elements, or reuse HtmlAgilityPack patterns.
• Use State when you want a control‑centric view (id, type, value, checked, options) and simpler access to form data.
• Both are snapshots of the form at the time it was closed/submitted.
• Edge engine does not expose a live DOM to JavaScript in the macro; you work with these two representations instead.

Parameters

url

Path to the HTML file, typically obtained using:

getGUIFilePath("MyForm.htm")

script (Edge only)

JavaScript injected into the form at load time. Useful for setting initial values, wiring events, or manipulating the page before the user interacts.

params

Optional object passed into the form. Can be used to pre‑populate fields or carry context into the HTML page.

Notes

• IE engine returns a live MSHTML DOM document.
• Edge engine returns Document (HtmlAgilityPack) and State (JavaScript array).
• There is no htmlData.JSONState property.
• Edge engine is recommended for all new development.
• Forms can be used from JScript.NET, JavaScriptV8, and PowerShellScript via SetupJS and SetupPS runtimes.