Nutforms Core extended by Nutforms Rules

nutforms-rules.js

window.NutformsRules.modelBuildCallback = (model) => {
  
  // Fetch rules from server
  let rawRules = fetchRules(model.entityName, model.context);
  // Translate rules to JS
  let rules = translateRulesToJS(rawRules);
  
  // Register listeners to attributes
  Object.keys(rules).forEach((attributeName) => {
    model.attribute[attributeName].listen("value-changed", (attribute) => {
      attribute.validationState = "changed";
      let result = evaluate(rule, attribute);
      attribute.validationState = result ? "valid" : "invalid";
    });
  });
  
  // Register listeners to model...
};

window.NutformsRules.formSubmittedCallback = (model, values) => {
  // Validate attribtues
  // Validate the whole model
};

page-using-nutforms.html

<!-- Import NUTFORMS core -->
<script src="../../dist/nutforms.js"></script>
<!-- Import NUTFORMS rules -->
<script src="../../dist/nutforms-rules.js"></script>
¨
<script type="text/javascript">
    // Register NutformsRules to Nutforms core events
    Nutforms.listen(NutformsActions.MODEL_BUILT, NutformsRules.modelBuildCallback);
    Nutforms.listen(NutformsActions.FORM_SUBMITTED, NutformsRules.formSubmittedCallback);

    // Generate the form
    nutforms = Nutforms.generateForm(
            document.getElementById("form"),                // HTML Element
            "cz.cvut.fel.nutforms.example.model.Bug",       // Entity name
            "cz_CS",                                        // Locale
            1,                                              // Entity id
            "cz.cvut.fel.nutforms.example.model.Bug/new",   // Layout name
            mappingFunction,                                // Mapping function
            "new"                                           // Business context
    );
</script>