dirrty    Star Tweet

dirrty is a lightweight jquery plugin you can use to detect if the fields of a form had been modified.

If a field has been modified then we say the form is dirty. With this plugin you can:

• Detect the moment when the form gets dirty, and trigger a custom event, for example enable a "save changes" button
• Detect the moment when the form gets clean again, and trigger a custom event, for example disable the "save changes" button, cause is not necesary
• Promt the user to save changes before leaving if the form is dirty

Usage:

$("#form-id").dirrty();

 

Setting up:

You can setup the pluging's options like this:

$("#form-id").dirrty({
  preventLeaving: true,
  leavingMessage: 'message',
  onDirty: onDirtyHandler,
  onClean: onCleanHandler,
});

 

Available options:

option	description	values
preventLeaving	Whether of not to show a warning when the user tries to leave the page with a dirty form	boolean
leavingMessage	Message to show when user tries to leave with a dirty form	string
onDirty	Function to be triggered when the form gets dirty	function
onClean	Function to be triggered when the form gets clean again	function

 

Demo

First name: Last name: Country: Puerto Rico Cuba USA

Message:

Kissed Britney?

Age: 20 - 25 25 - 30 30+

Clean

 

Installation

Clone the repo into your project

git clone https://github.com/rubentd/dirrty.git

Or install using bower

bower install --save dirrty

Then include the references to js file in your html:

<script type="text/javascript" src="bower_components/dirrty/dist/jquery.dirrty.js"></script>

 

If you liked this plugin, don't forget to give me a star on Github.