Entire form onChange

Question

How can I use onChange or a similar event for all form elements? I don\'t want to use onChange for each field separately.

Answer 1

If you are using jQuery, you can use the change event on the form element, because in jQuery the event bubbles up.

$('#formId').change(function(){...});

If you are using plain javascript, the change event does not bubble (at least not cross browser). So you would have to attach the event handler to each input element separately:

var inputs = document.getElementsByTagName("input"); 
for (i=0; i<inputs.length; i++){
   inputs[i].onchange = changeHandler;
}

(of course, you would have to do a similar thing to all selects and textareas)

Answer 2

You can use the change event on the form element:

var form = document.querySelector('form');
form.addEventListener('change', function() {
    alert('Hi!');
});