Thomas_Guttler
2021-06-23
I think it would be great if there would be the CSS pseudo classes
input:changed
and form:changed
.
Use case: I have a form which contains several inputs. It is a “traditional” form with a submit button.
For better UX the submit button should get highlighted if a input has changed.
Solutions like this create a lot of load at the client:
function initChangeDetection(form) {
Array.from(form).forEach(el => el.dataset.origValue = el.value);
}
function formHasChanges(form) {
return Array.from(form).some(el => 'origValue' in el.dataset && el.dataset.origValue !== el.value);
}
Source: https://stackoverflow.com/a/52593167/633961
This would be easily possible with CSS only if form:changed
would exist.
What can I do to make this dream come true?