Search code examples
javascripthtmlprototypejs

Detect actual form change?


Is there a ready-made way (maybe in one of the frameworks) to detect whether a form has changed compared to its original values?

The onchange event won't do, because it fires regardless of actual change (I could for example tick a checkbox on, and off again, with two onchange events).

The last resort would be to store each element's original value in a hidden field, and go through each one. If there is a faster method, I'd be happy to hear about it!


Solution

  • I'm not aware of any DOM event that detects changes made to children/descendant elements' value attributes, but it should be enough to compare the serialized values before/after, $('form').serialize(). I apologize if you already knew about this method specifically, I'm assuming you're manually going through form elements and appending values to a string.