Skip to content

Commit

Permalink
Merge pull request #917 from DavyJonesLocker/feature/remove-jquery-fr…
Browse files Browse the repository at this point in the history 
…om-builders

Remove jQuery from add and remove errors
  • Loading branch information
@tagliala
tagliala authored Sep 2, 2023
2 parents bf6df25 + bd8e9f6 commit e745f96
Show file tree
Hide file tree
Showing 12 changed files with 302 additions and 163 deletions.
100 changes: 63 additions & 37 deletions dist/client-side-validations.esm.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,23 @@ function _typeof(o) {
}, _typeof(o);
}

var arrayHasValue = function arrayHasValue(value, otherValues) {
for (var i = 0, l = otherValues.length; i < l; i++) {
if (value === otherValues[i]) {
return true;
}
}
return false;
};
var createElementFromHTML = function createElementFromHTML(html) {
var element = document.createElement('div');
element.innerHTML = html;
return element.firstChild;
};
var isValuePresent = function isValuePresent(value) {
return !/^\s*$/.test(value || '');
};

var ClientSideValidations = {
callbacks: {
element: {
Expand Down Expand Up @@ -153,35 +170,56 @@ var ClientSideValidations = {
formBuilders: {
'ActionView::Helpers::FormBuilder': {
add: function add($element, settings, message) {
var $form = jQuery($element[0].form);
if ($element.data('valid') !== false && $form.find("label.message[for=\"".concat($element.attr('id'), "\"]"))[0] == null) {
var $inputErrorField = jQuery(settings.input_tag);
var $labelErrorField = jQuery(settings.label_tag);
var $label = $form.find("label[for=\"".concat($element.attr('id'), "\"]:not(.message)"));
if ($element.attr('autofocus')) {
$element.attr('autofocus', false);
var element = $element[0];
var form = element.form;
var inputErrorTemplate = createElementFromHTML(settings.input_tag);
var inputErrorElement = element.closest(".".concat(inputErrorTemplate.getAttribute('class').replace(/ /g, '.')));
if (!inputErrorElement) {
inputErrorElement = inputErrorTemplate;
if (element.getAttribute('autofocus')) {
element.setAttribute('autofocus', false);
}
element.before(inputErrorElement);
inputErrorElement.querySelector('span#input_tag').replaceWith(element);
var inputErrorLabelMessageElement = inputErrorElement.querySelector('label.message');
if (inputErrorLabelMessageElement) {
inputErrorLabelMessageElement.setAttribute('for', element.id);
}
}
var labelElement = form.querySelector("label[for=\"".concat(element.id, "\"]:not(.message)"));
if (labelElement) {
var labelErrorTemplate = createElementFromHTML(settings.label_tag);
var labelErrorContainer = labelElement.closest(".".concat(labelErrorTemplate.getAttribute('class').replace(/ /g, '.')));
if (!labelErrorContainer) {
labelElement.after(labelErrorTemplate);
labelErrorTemplate.querySelector('label#label_tag').replaceWith(labelElement);
}
$element.before($inputErrorField);
$inputErrorField.find('span#input_tag').replaceWith($element);
$inputErrorField.find('label.message').attr('for', $element.attr('id'));
$labelErrorField.find('label.message').attr('for', $element.attr('id'));
$labelErrorField.insertAfter($label);
$labelErrorField.find('label#label_tag').replaceWith($label);
}
$form.find("label.message[for=\"".concat($element.attr('id'), "\"]")).text(message);
var labelMessageElement = form.querySelector("label.message[for=\"".concat(element.id, "\"]"));
if (labelMessageElement) {
labelMessageElement.textContent = message;
}
},
remove: function remove($element, settings) {
var $form = jQuery($element[0].form);
var $inputErrorFieldClass = jQuery(settings.input_tag).attr('class');
var $inputErrorField = $element.closest(".".concat($inputErrorFieldClass.replace(/ /g, '.')));
var $label = $form.find("label[for=\"".concat($element.attr('id'), "\"]:not(.message)"));
var $labelErrorFieldClass = jQuery(settings.label_tag).attr('class');
var $labelErrorField = $label.closest(".".concat($labelErrorFieldClass.replace(/ /g, '.')));
if ($inputErrorField[0]) {
$inputErrorField.find("#".concat($element.attr('id'))).detach();
$inputErrorField.replaceWith($element);
$label.detach();
$labelErrorField.replaceWith($label);
var element = $element[0];
var form = element.form;
var inputErrorClass = createElementFromHTML(settings.input_tag).getAttribute('class');
var inputErrorElement = element.closest(".".concat(inputErrorClass.replace(/ /g, '.')));
if (inputErrorElement) {
inputErrorElement.querySelector("#".concat(element.id)).remove();
inputErrorElement.replaceWith(element);
}
var labelElement = form.querySelector("label[for=\"".concat(element.id, "\"]:not(.message)"));
if (labelElement) {
var labelErrorClass = createElementFromHTML(settings.label_tag).getAttribute('class');
var labelErrorElement = labelElement.closest(".".concat(labelErrorClass.replace(/ /g, '.')));
if (labelErrorElement) {
labelErrorElement.replaceWith(labelElement);
}
}
var labelMessageElement = form.querySelector("label.message[for=\"".concat(element.id, "\"]"));
if (labelMessageElement) {
labelMessageElement.remove();
}
}
}
Expand Down Expand Up @@ -245,18 +283,6 @@ var ClientSideValidations = {
}
};

var arrayHasValue = function arrayHasValue(value, otherValues) {
for (var i = 0, l = otherValues.length; i < l; i++) {
if (value === otherValues[i]) {
return true;
}
}
return false;
};
var isValuePresent = function isValuePresent(value) {
return !/^\s*$/.test(value || '');
};

var absenceLocalValidator = function absenceLocalValidator($element, options) {
var element = $element[0];
if (isValuePresent(element.value)) {
Expand Down
100 changes: 63 additions & 37 deletions dist/client-side-validations.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,23 @@
}, _typeof(o);
}

var arrayHasValue = function arrayHasValue(value, otherValues) {
for (var i = 0, l = otherValues.length; i < l; i++) {
if (value === otherValues[i]) {
return true;
}
}
return false;
};
var createElementFromHTML = function createElementFromHTML(html) {
var element = document.createElement('div');
element.innerHTML = html;
return element.firstChild;
};
var isValuePresent = function isValuePresent(value) {
return !/^\s*$/.test(value || '');
};

var ClientSideValidations = {
callbacks: {
element: {
Expand Down Expand Up @@ -157,35 +174,56 @@
formBuilders: {
'ActionView::Helpers::FormBuilder': {
add: function add($element, settings, message) {
var $form = jQuery($element[0].form);
if ($element.data('valid') !== false && $form.find("label.message[for=\"".concat($element.attr('id'), "\"]"))[0] == null) {
var $inputErrorField = jQuery(settings.input_tag);
var $labelErrorField = jQuery(settings.label_tag);
var $label = $form.find("label[for=\"".concat($element.attr('id'), "\"]:not(.message)"));
if ($element.attr('autofocus')) {
$element.attr('autofocus', false);
var element = $element[0];
var form = element.form;
var inputErrorTemplate = createElementFromHTML(settings.input_tag);
var inputErrorElement = element.closest(".".concat(inputErrorTemplate.getAttribute('class').replace(/ /g, '.')));
if (!inputErrorElement) {
inputErrorElement = inputErrorTemplate;
if (element.getAttribute('autofocus')) {
element.setAttribute('autofocus', false);
}
element.before(inputErrorElement);
inputErrorElement.querySelector('span#input_tag').replaceWith(element);
var inputErrorLabelMessageElement = inputErrorElement.querySelector('label.message');
if (inputErrorLabelMessageElement) {
inputErrorLabelMessageElement.setAttribute('for', element.id);
}
}
var labelElement = form.querySelector("label[for=\"".concat(element.id, "\"]:not(.message)"));
if (labelElement) {
var labelErrorTemplate = createElementFromHTML(settings.label_tag);
var labelErrorContainer = labelElement.closest(".".concat(labelErrorTemplate.getAttribute('class').replace(/ /g, '.')));
if (!labelErrorContainer) {
labelElement.after(labelErrorTemplate);
labelErrorTemplate.querySelector('label#label_tag').replaceWith(labelElement);
}
$element.before($inputErrorField);
$inputErrorField.find('span#input_tag').replaceWith($element);
$inputErrorField.find('label.message').attr('for', $element.attr('id'));
$labelErrorField.find('label.message').attr('for', $element.attr('id'));
$labelErrorField.insertAfter($label);
$labelErrorField.find('label#label_tag').replaceWith($label);
}
$form.find("label.message[for=\"".concat($element.attr('id'), "\"]")).text(message);
var labelMessageElement = form.querySelector("label.message[for=\"".concat(element.id, "\"]"));
if (labelMessageElement) {
labelMessageElement.textContent = message;
}
},
remove: function remove($element, settings) {
var $form = jQuery($element[0].form);
var $inputErrorFieldClass = jQuery(settings.input_tag).attr('class');
var $inputErrorField = $element.closest(".".concat($inputErrorFieldClass.replace(/ /g, '.')));
var $label = $form.find("label[for=\"".concat($element.attr('id'), "\"]:not(.message)"));
var $labelErrorFieldClass = jQuery(settings.label_tag).attr('class');
var $labelErrorField = $label.closest(".".concat($labelErrorFieldClass.replace(/ /g, '.')));
if ($inputErrorField[0]) {
$inputErrorField.find("#".concat($element.attr('id'))).detach();
$inputErrorField.replaceWith($element);
$label.detach();
$labelErrorField.replaceWith($label);
var element = $element[0];
var form = element.form;
var inputErrorClass = createElementFromHTML(settings.input_tag).getAttribute('class');
var inputErrorElement = element.closest(".".concat(inputErrorClass.replace(/ /g, '.')));
if (inputErrorElement) {
inputErrorElement.querySelector("#".concat(element.id)).remove();
inputErrorElement.replaceWith(element);
}
var labelElement = form.querySelector("label[for=\"".concat(element.id, "\"]:not(.message)"));
if (labelElement) {
var labelErrorClass = createElementFromHTML(settings.label_tag).getAttribute('class');
var labelErrorElement = labelElement.closest(".".concat(labelErrorClass.replace(/ /g, '.')));
if (labelErrorElement) {
labelErrorElement.replaceWith(labelElement);
}
}
var labelMessageElement = form.querySelector("label.message[for=\"".concat(element.id, "\"]"));
if (labelMessageElement) {
labelMessageElement.remove();
}
}
}
Expand Down Expand Up @@ -249,18 +287,6 @@
}
};

var arrayHasValue = function arrayHasValue(value, otherValues) {
for (var i = 0, l = otherValues.length; i < l; i++) {
if (value === otherValues[i]) {
return true;
}
}
return false;
};
var isValuePresent = function isValuePresent(value) {
return !/^\s*$/.test(value || '');
};

var absenceLocalValidator = function absenceLocalValidator($element, options) {
var element = $element[0];
if (isValuePresent(element.value)) {
Expand Down
95 changes: 67 additions & 28 deletions src/core.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import jQuery from 'jquery'
import { createElementFromHTML } from './utils'

const ClientSideValidations = {
callbacks: {
Expand Down Expand Up @@ -140,38 +141,76 @@ const ClientSideValidations = {
formBuilders: {
'ActionView::Helpers::FormBuilder': {
add: ($element, settings, message) => {
const $form = jQuery($element[0].form)

if ($element.data('valid') !== false && ($form.find(`label.message[for="${$element.attr('id')}"]`)[0] == null)) {
const $inputErrorField = jQuery(settings.input_tag)
const $labelErrorField = jQuery(settings.label_tag)
const $label = $form.find(`label[for="${$element.attr('id')}"]:not(.message)`)
if ($element.attr('autofocus')) {
$element.attr('autofocus', false)
const element = $element[0]

const form = element.form

const inputErrorTemplate = createElementFromHTML(settings.input_tag)
let inputErrorElement = element.closest(`.${inputErrorTemplate.getAttribute('class').replace(/ /g, '.')}`)

if (!inputErrorElement) {
inputErrorElement = inputErrorTemplate

if (element.getAttribute('autofocus')) {
element.setAttribute('autofocus', false)
}

element.before(inputErrorElement)
inputErrorElement.querySelector('span#input_tag').replaceWith(element)

const inputErrorLabelMessageElement = inputErrorElement.querySelector('label.message')

if (inputErrorLabelMessageElement) {
inputErrorLabelMessageElement.setAttribute('for', element.id)
}
$element.before($inputErrorField)
$inputErrorField.find('span#input_tag').replaceWith($element)
$inputErrorField.find('label.message').attr('for', $element.attr('id'))
$labelErrorField.find('label.message').attr('for', $element.attr('id'))
$labelErrorField.insertAfter($label)
$labelErrorField.find('label#label_tag').replaceWith($label)
}
$form.find(`label.message[for="${$element.attr('id')}"]`).text(message)

const labelElement = form.querySelector(`label[for="${element.id}"]:not(.message)`)

if (labelElement) {
const labelErrorTemplate = createElementFromHTML(settings.label_tag)
const labelErrorContainer = labelElement.closest(`.${labelErrorTemplate.getAttribute('class').replace(/ /g, '.')}`)

if (!labelErrorContainer) {
labelElement.after(labelErrorTemplate)
labelErrorTemplate.querySelector('label#label_tag').replaceWith(labelElement)
}
}

const labelMessageElement = form.querySelector(`label.message[for="${element.id}"]`)

if (labelMessageElement) {
labelMessageElement.textContent = message
}
},
remove: ($element, settings) => {
const $form = jQuery($element[0].form)
const $inputErrorFieldClass = jQuery(settings.input_tag).attr('class')
const $inputErrorField = $element.closest(`.${$inputErrorFieldClass.replace(/ /g, '.')}`)
const $label = $form.find(`label[for="${$element.attr('id')}"]:not(.message)`)

const $labelErrorFieldClass = jQuery(settings.label_tag).attr('class')
const $labelErrorField = $label.closest(`.${$labelErrorFieldClass.replace(/ /g, '.')}`)

if ($inputErrorField[0]) {
$inputErrorField.find(`#${$element.attr('id')}`).detach()
$inputErrorField.replaceWith($element)
$label.detach()
$labelErrorField.replaceWith($label)
const element = $element[0]

const form = element.form

const inputErrorClass = createElementFromHTML(settings.input_tag).getAttribute('class')
const inputErrorElement = element.closest(`.${inputErrorClass.replace(/ /g, '.')}`)

if (inputErrorElement) {
inputErrorElement.querySelector(`#${element.id}`).remove()
inputErrorElement.replaceWith(element)
}

const labelElement = form.querySelector(`label[for="${element.id}"]:not(.message)`)

if (labelElement) {
const labelErrorClass = createElementFromHTML(settings.label_tag).getAttribute('class')
const labelErrorElement = labelElement.closest(`.${labelErrorClass.replace(/ /g, '.')}`)

if (labelErrorElement) {
labelErrorElement.replaceWith(labelElement)
}
}

const labelMessageElement = form.querySelector(`label.message[for="${element.id}"]`)

if (labelMessageElement) {
labelMessageElement.remove()
}
}
}
Expand Down
18 changes: 0 additions & 18 deletions src/helpers.js
View file

This file was deleted.

Loading

0 comments on commit e745f96

Please sign in to comment.