split checkboxRadio js util into two separate utils
This commit is contained in:
parent
616fdee4fc
commit
18c1cc7466
@ -82,7 +82,7 @@
|
|||||||
checkAllCheckbox.setAttribute('id', getCheckboxId());
|
checkAllCheckbox.setAttribute('id', getCheckboxId());
|
||||||
th.innerHTML = '';
|
th.innerHTML = '';
|
||||||
th.insertBefore(checkAllCheckbox, null);
|
th.insertBefore(checkAllCheckbox, null);
|
||||||
utilInstances.push(window.utils.setup('checkboxRadio', checkAllCheckbox));
|
utilInstances.push(window.utils.setup('checkbox', checkAllCheckbox));
|
||||||
|
|
||||||
checkAllCheckbox.addEventListener('input', onCheckAllCheckboxInput);
|
checkAllCheckbox.addEventListener('input', onCheckAllCheckboxInput);
|
||||||
setupCheckboxListeners();
|
setupCheckboxListeners();
|
||||||
|
|||||||
@ -13,10 +13,16 @@
|
|||||||
|
|
||||||
var utilInstances = [];
|
var utilInstances = [];
|
||||||
|
|
||||||
// checkboxes / radios
|
// checkboxes
|
||||||
var checkboxes = Array.from(wrapper.querySelectorAll('input[type="checkbox"], input[type="radio"]'));
|
var checkboxes = Array.from(wrapper.querySelectorAll('input[type="checkbox"]'));
|
||||||
checkboxes.filter(isNotInitialized).forEach(function(checkbox) {
|
checkboxes.filter(isNotInitialized).forEach(function(checkbox) {
|
||||||
utilInstances.push(window.utils.setup('checkboxRadio', checkbox));
|
utilInstances.push(window.utils.setup('checkbox', checkbox));
|
||||||
|
});
|
||||||
|
|
||||||
|
// radios
|
||||||
|
var radios = Array.from(wrapper.querySelectorAll('input[type="radio"]'));
|
||||||
|
radios.filter(isNotInitialized).forEach(function(radio) {
|
||||||
|
utilInstances.push(window.utils.setup('radio', radio));
|
||||||
});
|
});
|
||||||
|
|
||||||
// file-uploads
|
// file-uploads
|
||||||
@ -167,17 +173,15 @@
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
// turns native checkboxes and radio buttons into custom ones
|
// turns native checkboxes into custom ones
|
||||||
window.utils.checkboxRadio = function(input) {
|
window.utils.checkbox = function(input) {
|
||||||
|
|
||||||
var type = input.getAttribute('type');
|
if (!input.parentElement.classList.contains('checkbox')) {
|
||||||
|
|
||||||
if (!input.parentElement.classList.contains(type)) {
|
|
||||||
var parentEl = input.parentElement;
|
var parentEl = input.parentElement;
|
||||||
var siblingEl = input.nextElementSibling;
|
var siblingEl = input.nextElementSibling;
|
||||||
var wrapperEl = document.createElement('div');
|
var wrapperEl = document.createElement('div');
|
||||||
var labelEl = document.createElement('label');
|
var labelEl = document.createElement('label');
|
||||||
wrapperEl.classList.add(type);
|
wrapperEl.classList.add('checkbox');
|
||||||
labelEl.setAttribute('for', input.id);
|
labelEl.setAttribute('for', input.id);
|
||||||
wrapperEl.appendChild(input);
|
wrapperEl.appendChild(input);
|
||||||
wrapperEl.appendChild(labelEl);
|
wrapperEl.appendChild(labelEl);
|
||||||
@ -195,4 +199,27 @@
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// turns native radio buttons into custom ones
|
||||||
|
window.utils.radio = function(input) {
|
||||||
|
|
||||||
|
if (!input.parentElement.classList.contains('radio')) {
|
||||||
|
var parentEl = input.parentElement;
|
||||||
|
var siblingEl = input.nextElementSibling;
|
||||||
|
var wrapperEl = document.createElement('div');
|
||||||
|
wrapperEl.classList.add('radio');
|
||||||
|
wrapperEl.appendChild(input);
|
||||||
|
|
||||||
|
if (siblingEl && siblingEl.matches('label')) {
|
||||||
|
wrapperEl.appendChild(siblingEl);
|
||||||
|
}
|
||||||
|
|
||||||
|
input.classList.add(JS_INITIALIZED_CLASS);
|
||||||
|
parentEl.appendChild(wrapperEl);
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
destroy: function() {},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
|||||||
Reference in New Issue
Block a user