fix(form): rebind events on dynamic fields

Whenever a form field is dynamically added to the form and added/removed via add field or remove field to add/remove related rules, the event listeners to such new fields wre not renewed resulting in not correctly validating the new field at runtime.
fomantic · Mar 16, 2022 · 135cfd1 · 135cfd1
1 parent 955ee7c
commit 135cfd1
Showing 1 changed file with 8 additions and 1 deletion.
diff --git a/src/definitions/behaviors/form.js b/src/definitions/behaviors/form.js
@@ -131,6 +131,11 @@ $.fn.form = function(parameters) {
           $reset      = $module.find(selector.reset);
         },
 
+        refreshEvents: function() {
+          module.removeEvents();
+          module.bindEvents();
+        },
+
         submit: function() {
           module.verbose('Submitting form', $module);
           submitting = true;
@@ -391,7 +396,6 @@ $.fn.form = function(parameters) {
           $module.off(eventNamespace);
           $field.off(eventNamespace);
           $submit.off(eventNamespace);
-          $field.off(eventNamespace);
         },
 
         event: {
@@ -864,9 +868,11 @@ $.fn.form = function(parameters) {
               }
             });
             module.debug('Adding rules', newValidation.rules, validation);
+            module.refreshEvents();
           },
           fields: function(fields) {
             validation = $.extend(true, {}, validation, module.get.fieldsFromShorthand(fields));
+            module.refreshEvents();
           },
           prompt: function(identifier, errors, internal) {
             var
@@ -963,6 +969,7 @@ $.fn.form = function(parameters) {
             $.each(fields, function(index, field) {
               module.remove.rule(field);
             });
+            module.refreshEvents();
           },
           // alias
           rules: function(field, rules) {