Checking if field data changed before leaving page

Question

How should you place one validator on a masterpage that wont allow postback of any content pages until all changed control data on that page has been either saved or canceled.

The specifics of my current situation and the way its currently being done on my project are listed below

This is an IE web application. The application is currently uses CSS behaviors to set HTML Components on certain control types which add properties to the control. These properties are set with the data contained by the control by javascript after the page has been served up to the client. The master page has a validator that uses javascript to compare the data in these new properties with the current values of the controls to see if data has been changed. This is destroying the performance of the app and needs to be changed. The CSS HTML component stuff really drags and is not even compatible with many browsers. Two possibilities im considering pursuing are 1.) add the attributes to the controls serverside on init of the basepage, or around there, and then continuing using the current javascript to set them. or 2.) using the same javascript that sets the properties to add them as well.

If someone has encountered this issue before or has any better ideas on how i should handle a situation like this please let me know.

Thanks

Answer 1

I did solved one of such problem before. The problem is to warn the user to save any changes on the form elements change. I used jQuery (although can be done using regular java script) This is the global function which keeps on monitoring all the inputs and selects and set a dirtyFlag to true on change. ( you may need to add same for other controls too)

$(function() {
        $('input').livequery('change', markDirtyFlag);
        $('select').livequery('change', markDirtyFlag);
});

When user navigates away from the page or when other ajax calls are done you can check the dirty flag and warn the user. (ajax calls can be trapped using jQuery global callbacks and window unload events).