🔄 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.