Skip to content

App Connect JavaScript Functions

Bridge App Connect state and focused custom JavaScript with dmx.parse(), dmx.app.data, and reactive expressions in one maintainable page.

Use JavaScript as a focused extension point

App Connect already handles state, bindings, events, and updates declaratively. Add a normal JavaScript function when a project-specific calculation or integration is clearer in code, then call it from an App Connect expression.

Read an expression
Use `dmx.parse()` when the function needs the current value of an App Connect expression.
Inspect state
Use `dmx.app.data` when you deliberately need the complete live state tree.
Stay reactive
Call the function from a binding so the result updates when its App Connect inputs change.

Keep the state visible and inspectable

The expanded Structure tree identifies taxRate as an App Connect value component. Its populated Properties panel keeps the initial value editable without hiding the component inside custom code.

Read App Connect values from focused JavaScript

quoteTotal() uses dmx.parse('taxRate.value') to evaluate the same expression available in Wappler’s visual bindings. currentQuoteState() demonstrates direct access through dmx.app.data for advanced integrations.

The binding remains reactive

The total calls quoteTotal(subtotal.value) from a normal App Connect text binding. Changing subtotal causes App Connect to reevaluate the binding and redraw the result—no manual DOM update is required.

A maintainable boundary between visual logic and code

Prefer App Connect’s visual state, events, and formatters for common behavior. Use small named JavaScript functions for truly custom logic, pass explicit inputs where practical, and keep state access readable so the next developer can follow the data flow.