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

10
validation.js
View File

@ -1,5 +1,5 @@
class ValidationField {
dependant = null
dependent = null
el = null
formGroupEl = null
isValid = null
@ -96,12 +96,12 @@ class ValidationField {
// add a native pattern attr if pattern property is present
if (this.pattern) this.el.setAttribute('pattern', this.pattern)
// dependant fields
if (this.dependant) {
const parents = this.validationInstance.form.querySelectorAll(`[name="${this.dependant}"]`)
// dependent fields
if (this.dependent) {
const parents = this.validationInstance.form.querySelectorAll(`[name="${this.dependent}"]`)
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))) {
this.el.removeAttribute('disabled')
} else {