2009
I was pretty happy with the functionality of my original dirtyFields jQuery plugin, but as comments and questions about the plugin started coming in, I soon realized that there was a lot of room for improvement. So I spent the last few weeks reworking the code to create a more flexible, more powerful version, one that completely replaces the original version.
The main purpose of the plugin remains the same: it helps you show a user exactly which HTML form fields have been changed (made "dirty") since the page was last loaded or saved (text inputs, drop-downs, checkboxes, etc.). But the new version of the plugin gives you more control over what page elements are affected when a particular form field is changed, provides callbacks that let you execute your own functions before and after a form field is processed by the plugin, and includes over a dozen public functions for manipulating individual form fields or the entire form (including functions that let you add the plugin event handler to any new form fields you add to the form dynamically after the page is loaded).
I created a website to go along with the new plugin that provides full documentation on all of the plugin settings, callbacks, and public functions and three working examples that demonstrate the plugin in action. You can go there to learn all of the details:
http://www.thoughtdelimited.org/dirtyFields/index.cfm
Oct 22, 2009 at 1:53 PM Brian, love the plugin. One question though, do you have any thoughts about how to include an FCKEditor field in the mix?
Oct 22, 2009 at 9:59 PM @Dean: Good question. It looks like you can bind a function to the "OnSelectionChange" custom event of the editor window (FCKEditor's answer to the standard "change" event) with the FCKEditor API (http://docs.cksource.com/FCKeditor_2.x/Developers_Guide/JavaScript_API). The trick, though, is that the FCKEditor doesn't seem to be fully loaded by the time jQuery's document.ready event fires, so you have to find a way to call the API after the page has fully loaded.
I may play with it over the weekend myself and see what's the best way of going about it.
Oct 24, 2009 at 4:24 PM @Dean: I just put up a new blog post that hopefully answers your question: http://www.thoughtdelimited.org/thoughts/post.cfm/how-to-use-the-jquery-dirtyfields-plugin-with-fckeditor
Jul 28, 2010 at 10:42 PM Brian, I also love the plugin, so thanks.
I made a small modification to make it more robust, which I wanted to let you know about, in case you wanted to include it in your version.
The background is that I'm not interested in visual cues for dirty fields, I just want to know if the form is dirty. So I don't really want to hook up each of my input fields to a label or any other control. But of course this breaks the plugin -- my formChangeCallback function fires when I change the input value, but the first parameter (dirty or not) always returns "clean".
I found that in the UpdateFormStatus function, the first line gets a count of all field labels which have been set to dirty in order to decide if the form is dirty. I changed this line to instead check the length of the dirtyFieldsDataProperty array.
With this change, my form status is correctly tracked even if I don't have a label for every field.
Cheers,
Brett Donald
May 15, 2012 at 4:45 AM Brett,
I also don't want to use labels, so I tried what you suggested there. But it doesn't seem to be working.When I tried for Checkboxes,It tracks all the changes but when one dirty checkbox is rolled back though other boxes (in same checkboxes )are dirty, it shows the form clean..
Any other idea ?
Brian,
Please provide some functionality or some temporary workaround.
- Nilesh Injulkar
Jun 3, 2012 at 2:28 PM @Nilesh: I took a look at the code regarding the checkbox evaluation and found a bug that, when combined with Brett's suggested change, would incorrect evaluate the form as being clean when there were still changed checkboxes.
I incorporated Brett's change and fixed the bug, so if you download the new version it should solve your problem.
Even though I went with Brett's suggestion, I will point out that the plugin does let you override where the CSS class denoting a dirty field will be applied on a field-by-field basis (using the fieldOverrides option), so it's possible to assign that CSS class to the form element itself if there are no label or other descriptive text elements associated with the form control.