Vanilla JS library for tracking state of browser form controls

Version 1.0 (11/03/2018)
Price: Free / Donations

Form-change-tracker is a small (less than 2 kB gzipped), dependency-free JavaScript browser library for keeping track of the state (pristine vs. changed) of controls in a DOM-based form.

Using this state (i.e.: via CSS class names added or removed from controls and their associated <label> elements), you can provide visual feedback regarding which controls have changed and which have not. Of course, it will detect if an element is first changed and then changed back to its initial value. Additionally, form-change-tracker automatically manages disabling or enabling a reset button, if there is one in the form. Finally, you can define a callback function to trigger arbitrary actions.

This library is probably not what you need in a project where you already are using some SPA framework (React, Angular, Vue or the like), but is a nice addition for “classical” mainly server-driven applications.

Since version 1.0, form-change-tracker has been a plain ES6 class (previously: UMD) which can be used natively or in a toolchain driven by bundlers such as Webpack or Parcel.

You can read more on installation and usage on npm.

Back to list of projects