rooseveltframework / semantic-forms

🎯 A pattern library of forms based on semantic HTML enhanced with a modern UX.
Other
8 stars 4 forks source link

Restrict JS events to target elements within semanticForms class form elements #3

Closed kethinov closed 5 years ago

kethinov commented 6 years ago

At present, these JS events could stand to be a bit more defensive.

It would be preferable to return false on them immediately if the target element is not within a form element of class semanticForms. That restriction will prevent the events from firing in a context where they're not needed.

In the original version of this project, those events were just attached directly to the input elements that needed them, but this turned out to be inadequate because if you added more form elements to the DOM after this library's JS executes, the newly added form elements wouldn't get the JS events.

Adding a global event listener to the body tag itself solves that problem, but introduces the problem of needing to make sure the event is defensive enough to not fire when not needed.

Returning false if the target element is not within a form element of class semanticForms should help, but I am certainly open to other suggestions as well.