Skip to content

Commit

Permalink
fix(formvalidation): support file inputs for validation
Browse files Browse the repository at this point in the history
This PR reverts #1950 as the cause of the original issue was related to the separate dirty events which were refactored before 2.8.8 was released.
I also added some checks for reset and set values as file inputs would otherwise return a js error as file input cannot be set any value other than an empty string.

Additionally this PR simplifies the input change event detection as we dont support older browsers than ie11 and avoid memory leaks when attachEvents behavior is used and the form gets detroyed.
  • Loading branch information
lubber-de committed Feb 26, 2023
1 parent e19bdc5 commit 880333c
Showing 1 changed file with 25 additions and 17 deletions.
42 changes: 25 additions & 17 deletions src/definitions/behaviors/form.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@
$.fn.form = function (parameters) {
var
$allModules = $(this),
$window = $(window),

time = Date.now(),
performance = [],
Expand Down Expand Up @@ -60,6 +61,8 @@
namespace,
moduleNamespace,
eventNamespace,
attachEventsSelector,
attachEventsAction,

submitting = false,
dirty = false,
Expand Down Expand Up @@ -142,6 +145,9 @@
module[action]();
event.preventDefault();
});

attachEventsSelector = selector;
attachEventsAction = action;
},

bindEvents: function () {
Expand All @@ -167,7 +173,7 @@

// Dirty events
if (settings.preventLeaving) {
$(window).on('beforeunload' + eventNamespace, module.event.beforeUnload);
$window.on('beforeunload' + eventNamespace, module.event.beforeUnload);
}

$field.on('change' + eventNamespace
Expand All @@ -185,6 +191,9 @@
$module.on('clean' + eventNamespace, function (e) {
settings.onClean.call();
});
if (attachEventsSelector) {
module.attachEvents(attachEventsSelector, attachEventsAction);
}
},

clear: function () {
Expand Down Expand Up @@ -233,6 +242,7 @@
isCheckbox = $field.is(selector.checkbox),
isDropdown = $element.is(selector.uiDropdown) && module.can.useElement('dropdown'),
isCalendar = $calendar.length > 0 && module.can.useElement('calendar'),
isFile = $field.is(selector.file),
isErrored = $fieldGroup.hasClass(className.error)
;
if (defaultValue === undefined) {
Expand All @@ -253,7 +263,7 @@
$calendar.calendar('set date', defaultValue);
} else {
module.verbose('Resetting field value', $field, defaultValue);
$field.val(defaultValue);
$field.val(isFile ? '' : defaultValue);
}
});
module.remove.states();
Expand Down Expand Up @@ -389,6 +399,13 @@
$module.off(eventNamespace);
$field.off(eventNamespace);
$submit.off(eventNamespace);
if (settings.preventLeaving) {
$window.off(eventNamespace);
}
if (attachEventsSelector) {
$(attachEventsSelector).off(eventNamespace);
attachEventsSelector = undefined;
}
},

event: {
Expand Down Expand Up @@ -490,18 +507,7 @@
return rule.type;
},
changeEvent: function (type, $input) {
if (type === 'checkbox' || type === 'radio' || type === 'hidden' || $input.is('select')) {
return 'change';
}

return module.get.inputEvent();
},
inputEvent: function () {
return document.createElement('input').oninput !== undefined
? 'input'
: (document.createElement('input').onpropertychange !== undefined
? 'propertychange'
: 'keyup');
return ['file', 'checkbox', 'radio', 'hidden'].indexOf(type) >= 0 || $input.is('select') ? 'change' : 'input';
},
fieldsFromShorthand: function (fields) {
var
Expand Down Expand Up @@ -1106,6 +1112,7 @@
$field = module.get.field(key),
$element = $field.parent(),
$calendar = $field.closest(selector.uiCalendar),
isFile = $field.is(selector.file),
isMultiple = Array.isArray(value),
isCheckbox = $element.is(selector.uiCheckbox) && module.can.useElement('checkbox'),
isDropdown = $element.is(selector.uiDropdown) && module.can.useElement('dropdown'),
Expand Down Expand Up @@ -1148,7 +1155,7 @@
$calendar.calendar('set date', value);
} else {
module.verbose('Setting field value', value, $field);
$field.val(value);
$field.val(isFile ? '' : value);
}
}
});
Expand Down Expand Up @@ -1651,9 +1658,10 @@
selector: {
checkbox: 'input[type="checkbox"], input[type="radio"]',
clear: '.clear',
field: 'input:not(.search):not([type="file"]):not([type="reset"]):not([type="button"]):not([type="submit"]), textarea, select',
field: 'input:not(.search):not([type="reset"]):not([type="button"]):not([type="submit"]), textarea, select',
file: 'input[type="file"]',
group: '.field',
input: 'input:not([type="file"])',
input: 'input',
message: '.error.message',
prompt: '.prompt.label',
radio: 'input[type="radio"]',
Expand Down

0 comments on commit 880333c

Please sign in to comment.