minor fixes for file-inputs and buttons

This commit is contained in:
Felix Hamann 2018-03-08 02:20:07 +01:00
parent 621d10807c
commit e4ddcd9e49
2 changed files with 17 additions and 14 deletions

View File

@ -124,7 +124,7 @@ buttonField btn = Field {fieldParse, fieldView, fieldEnctype}
fieldView fid name attrs _val _ = fieldView fid name attrs _val _ =
[whamlet| [whamlet|
<button .button .#{bcc2txt $ cssClass btn} type=submit name=#{name} value=#{toPathPiece btn} *{attrs} ##{fid}>^{label btn} <input .#{bcc2txt $ cssClass btn} type=submit name=#{name} value=^{label btn} *{attrs} ##{fid}>
|] |]
fieldParse [] _ = return $ Right Nothing fieldParse [] _ = return $ Right Nothing

View File

@ -26,24 +26,21 @@
}); });
}; };
window.utils.reactiveFormGroup = function(formGroup, input, listen) { window.utils.reactiveFormGroup = function(formGroup, input) {
// updates to dom // updates to dom
if (input.value.length > 0) { if (input.value.length > 0) {
formGroup.classList.add('form-group--valid'); formGroup.classList.add('form-group--valid');
} else { } else {
formGroup.classList.remove('form-group--valid'); formGroup.classList.remove('form-group--valid');
} }
// add event listeners if told to listen input.addEventListener('input', function() {
if (listen) { formGroup.classList.remove('form-group--has-error');
input.addEventListener('input', function() { if (input.value.length > 0) {
console.log(input, 'got inpit'); formGroup.classList.add('form-group--valid');
if (input.value.length > 0) { } else {
formGroup.classList.add('form-group--valid'); formGroup.classList.remove('form-group--valid');
} else { }
formGroup.classList.remove('form-group--valid'); });
}
});
}
}; };
window.utils.reactiveFileUpload = function(input, parent) { window.utils.reactiveFileUpload = function(input, parent) {
@ -70,14 +67,19 @@
parent.appendChild(addMore); parent.appendChild(addMore);
} }
function updateParent() { function updateParent() {
var submitBtn = parent.parentElement.querySelector('[type=submit]');
if (currInputCount > 0) { if (currInputCount > 0) {
if (parent.classList.contains('form-group')) { if (parent.classList.contains('form-group')) {
parent.classList.add('form-group--valid') parent.classList.add('form-group--valid')
parent.classList.remove('form-group--has-error');
} }
submitBtn.removeAttribute('disabled');
} else { } else {
if (parent.classList.contains('form-group')) { if (parent.classList.contains('form-group')) {
parent.classList.remove('form-group--has-error');
parent.classList.remove('form-group--valid') parent.classList.remove('form-group--valid')
} }
submitBtn.setAttribute('disabled', 'disabled');
} }
} }
function addListener(destInput) { function addListener(destInput) {
@ -90,6 +92,7 @@
}); });
} }
addListener(input); addListener(input);
updateParent();
} }
// registers input-listener for each element in <elements> (array) and // registers input-listener for each element in <elements> (array) and
@ -128,7 +131,7 @@ document.addEventListener('DOMContentLoaded', function() {
var isInFormGroup = parent.classList.contains('form-group') && parent.classList.contains('form-group--required'); var isInFormGroup = parent.classList.contains('form-group') && parent.classList.contains('form-group--required');
if (isInFormGroup) { if (isInFormGroup) {
window.utils.reactiveFormGroup(parent, input, isListening); window.utils.reactiveFormGroup(parent, input);
} }
if (isFileInput) { if (isFileInput) {
window.utils.reactiveFileUpload(input, parent); window.utils.reactiveFileUpload(input, parent);