When the document.ready fires, this data gets set (simplified for
example purposes):
[code]
function getFields() {
var s = {
"field1" : $("#field1").val(),
"field2" : $("#field2").val(),
"field3" : $("#field3").val()
}
return s;
$("#original_data").data("fields",getFields());
[/code]
Then, when someone blurs a field, this gets called:
[code]
function autosave() {
$("#new-fields").data("fields",getFields());
var o = $("#original-fields"), n = $("#new-fields");
/* This is where I'm hitting a wall */
if (o != n) {
doSomethingElse(); // This would be an AJAX call to save anything
that has changed.
}
}
$("input,textarea").blur(function(){
autosave();
});
[/code]
How can I compare the #original-fields data with the #new-fields data?
As it is, the two always differ; I assume this is because they are
different objects. I need to quickly and efficiently burn through the
two, and compare their data values, returning the field(s) and value
(s) that have changed?
I am doing it this way because there are some fields that, when they
are changed, change other fields. Therefore a simple blur(function()
{}) wouldn't quite do it. It would only save THAT field, but not its
affected fields.
