danremollino/form-validation
1
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

dependant -> dependent

Browse Source
This commit is contained in:
Dan Remollino
2025-04-12 11:39:09 -04:00
parent 28e5b39962
commit e114c8a175
2 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
index.html
View File

@ -149,15 +149,15 @@
</figure> </figure>
<figure class="form-group"> <figure class="form-group">
<label for="dependant-parent">Dependant Parent</label> <label for="dependent-parent">Dependent Parent</label>
<input id="dependant-parent" type="text" name="dependant_parent"> <input id="dependent-parent" type="text" name="dependent_parent">
<figcaption>This field dynamically enables/disables the 'Dependant Child' field if it has a value.</figcaption> <figcaption>This field dynamically enables/disables the 'Dependent Child' field if it has a value.</figcaption>
</figure> </figure>
<figure class="form-group"> <figure class="form-group">
<label for="dependant-child">Dependant Child</label> <label for="dependent-child">Dependent Child</label>
<input data-validation='{"dependant": "dependant_parent"}' id="dependant-child" type="text" name="dependant_child"> <input data-validation='{"dependent": "dependent_parent"}' id="dependent-child" type="text" name="dependent_child">
<figcaption>This field dynamically enables/disables if the 'Dependant Parent' field has a value.</figcaption> <figcaption>This field dynamically enables/disables if the 'Dependent Parent' field has a value.</figcaption>
</figure> </figure>
</fieldset> </fieldset>

10
validation.js
View File

@ -1,5 +1,5 @@
class ValidationField { class ValidationField {
dependant = null dependent = null
el = null el = null
formGroupEl = null formGroupEl = null
isValid = null isValid = null
@ -96,12 +96,12 @@ class ValidationField {
// add a native pattern attr if pattern property is present // add a native pattern attr if pattern property is present
if (this.pattern) this.el.setAttribute('pattern', this.pattern) if (this.pattern) this.el.setAttribute('pattern', this.pattern)
// dependant fields // dependent fields
if (this.dependant) { if (this.dependent) {
const parents = this.validationInstance.form.querySelectorAll(`[name="${this.dependant}"]`) const parents = this.validationInstance.form.querySelectorAll(`[name="${this.dependent}"]`)
const depCheck = () => { const depCheck = () => {
if (((parents[0].type === 'checkbox' || parents[0].type === 'radio') && this.validationInstance.form.querySelectorAll(`[name="${this.dependant}"]:checked`).length > 0) || if (((parents[0].type === 'checkbox' || parents[0].type === 'radio') && this.validationInstance.form.querySelectorAll(`[name="${this.dependent}"]:checked`).length > 0) ||
(((parents[0].type !== 'checkbox' && parents[0].type !== 'radio') && parents[0].value))) { (((parents[0].type !== 'checkbox' && parents[0].type !== 'radio') && parents[0].value))) {
this.el.removeAttribute('disabled') this.el.removeAttribute('disabled')
} else { } else {