When the document.ready fires, this data gets set (simplified for
example purposes):

function getFields() {
 var s = {
  "field1" : $("#field1").val(),
  "field2" : $("#field2").val(),
  "field3" : $("#field3").val()
 }
 return s;
}

$("#original-fields").data("fields",getFields());

Then, when someone blurs a field, this gets called:

function autosave() {
 $("#new-fields").data("fields",getFields());
 var o = $("#original-fields"), n = $("#new-fields");
 if (o != n) { // <-- BRICK WALL
  someAJAXFunctionThatSavesTheFieldsThatChanged();
 }
}

$("input,textarea").blur(function(){
 autosave();
});

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.

Reply via email to