Search Documentation

Posting Data Without Forms

One of the key strengths of Trongate MX is that it allows you to post values using mechanisms that don’t require rendering traditional HTML forms. Whether you’re triggering an HTTP request from a button, link, or another interactive element, you can still submit structured data directly to your server. This opens the door to a more dynamic and modular approach to building interfaces, especially in situations where full form markup would be overkill.

To support this flexibility, Trongate MX introduces two special attributes: mx-vals and mx-dom-vals. These attributes give you precise control over what data is included in your HTTP requests - whether it's predefined static values or dynamic content captured directly from the DOM. You can use them on forms, buttons, links, or any element that initiates an HTTP request via Trongate MX.

mx-vals is used to inject static key-value pairs into your request, while mx-dom-vals dynamically extracts values from the page at the moment of submission. Both attributes eliminate the need for hidden inputs or custom JavaScript, keeping your HTML clean and your UX responsive.

Adding Static Values with mx-vals

The mx-vals attribute allows you to attach additional values to your HTTP requests as if they were submitted as part of an ordinary HTML form.

Basic Button Example

Pure HTML equivalent:

Using Predefined Arrays (Recommended)

Usage with Forms

Pure HTML equivalent:

When this form is submitted, it will send:

• The visible form field (first_name)
• The additional values defined in mx-vals (last_name and age)

Capturing Dynamic Content with mx-dom-vals

The mx-dom-vals attribute enables you to dynamically attach values from DOM elements to your HTTP requests. This powerful feature allows you to capture and transmit information from specific elements on your page, such as text content or input values.

Basic Example

Pure HTML equivalent:

When clicked, this button will:

• Find the first <h1> element on the page
• Capture its text content
• Send this value to the server as a parameter named "headline"

Using json_encode with PHP Arrays

Capturing Multiple Elements

Server-Side Handling

Here's how to handle the submitted data in your PHP endpoint:

The captured values are accessible in your controller using the post() function:

Available Properties

You can use any of these properties in your mx-dom-vals:

• value: Gets the current value (best for form inputs)
• innerText: Gets the text content only
• innerHTML: Gets the HTML content inside the element
• outerHTML: Gets the entire element including its HTML tags

Summary

The mx-vals and mx-dom-vals attributes provide powerful ways to include additional data with your HTTP requests in Trongate MX. Whether you're adding static parameters to a button click or capturing dynamic content from the page, these attributes offer flexibility and convenience while keeping your HTML clean and eliminating the need for custom JavaScript.

In the next section, we'll explore the crown jewel of Trongate MX form handling: modal form workflows. This elegant approach combines; dynamic modal creation, form validation, loading states, and success feedback.