AppML – Dynamic Controller-Model Binding: Real-Time Logic Meets Structured Data

Introduction – What Is Dynamic Controller-Model Binding?

In AppML, controllers bring logic, and models bring structure. When you dynamically bind them together, you unlock powerful features like:

• Real-time filtering and sorting
• Context-based validation
• Data-driven form behaviors

Dynamic controller-model binding refers to how AppML lets your controller script interact with your data model at runtime—without tightly coupling them in code.

In this guide, you’ll learn:

• How AppML controllers dynamically access and manipulate model data
• Use cases like filtering, validation, and CRUD logic
• Example code to connect models and controllers in real-time
• Best practices for scalable, logic-rich AppML apps

How Does Dynamic Binding Work in AppML?

When you use both appml-model and appml-controller in an element, AppML:

1. Loads the model to define fields, validation, and backend mapping
2. Loads the controller to allow runtime interaction with that model

HTML Example:

<div 
  appml-model="models/order-model.json" 
  appml-data="get-orders.php" 
  appml-controller="order-controller.js">
  
  <input name="customer">
  <input name="amount">
  <button appml-submit>Save</button>
</div>

Controller: order-controller.js

myAppML.onshow = function() {
  myAppML.filter = "amount > 100";
  myAppML.sort = "customer";
};

✔️ This dynamically filters and sorts the data before it’s displayed.

Accessing Model Fields Dynamically in Controllers

Inside any controller lifecycle method (onshow, onvalidate, onsubmit), the current model data is accessible using:

myAppML.data.<fieldname>

Example: Validate Required Field

myAppML.onvalidate = function() {
  if (myAppML.data.customer === "") {
    alert("Customer name is required.");
    return false;
  }
  return true;
};

Changing Filters Based on Input

Use form inputs to update filters in real-time:

HTML Input

<input type="text" onkeyup="filterOrders(this.value)">

Controller Script

function filterOrders(text) {
  myAppML.filter = "customer LIKE '*" + text + "*'";
  myAppML.load(); // Re-load data with filter
}

This updates the view based on what the user types—without reloading the whole page.

Binding a Dynamic Model at Runtime (Advanced)

While models are usually static JSON files, you can assign a model dynamically:

myAppML.model = {
  tablename: "products",
  fields: [
    { name: "id", primarykey: true },
    { name: "name", required: true },
    { name: "price", datatype: "number" }
  ]
};

However, using external .json or .xml files for models is the best practice for maintainability.

Example: Dynamic Form Behavior Based on Model Data

Conditional Field Validation

myAppML.onvalidate = function() {
  if (myAppML.data.category === "Premium" && myAppML.data.price < 100) {
    alert("Premium items must be at least $100.");
    return false;
  }
  return true;
};

This binds business logic to data conditions, all defined dynamically.

Use Cases for Dynamic Controller-Model Binding

Summary – Recap & Key Takeaways

AppML’s ability to dynamically bind models and controllers allows you to build apps that are not only data-rich but also context-aware. You can react to data changes, validate based on input, and filter live content—all without JS frameworks.

Key Takeaways:

• Use appml-model + appml-controller for full MVC interaction
• Controllers access model data with myAppML.data.<field>
• Logic like filter/sort/validation can be data-driven
• Inputs and conditions can trigger dynamic reloads

This pattern is ideal for dashboards, admin panels, search tools, and forms with logic.

FAQs – Dynamic Controller-Model Binding in AppML

Can one controller work with multiple models?
Yes, but each appml-model must be linked separately. Controllers should detect context if reused.

Can I change the model structure at runtime?
Not recommended. Stick to external JSON files. You can assign myAppML.model manually for edge cases.

Is it possible to dynamically load a different model file?
Yes. Replace the appml-model attribute value and call myAppML.load().

How do I debug model/controller logic in AppML?
Use console.log(myAppML) inside your controller methods and inspect with Dev Tools.

Is dynamic binding safe for production apps?
Yes, if you validate all user input and sanitize filters on the backend.