Jquery Javascript object - compare and replace some of the values with another similar object

Question

There is an Javascript object (formData) that I need to replace some of the values by comparing with another object (dataObject). The JSON for both objects is below. Now what I need is, snippet:

Main formData Object:

{
                "name": "abNotes",
                "label": "Ab Notes: (Optional)",
                "type": "TEXT_BOX_SINGLE",
                "value": "Example Notes",
                "active": true
}

I need to compare the "value" to the other dataObject by "name" property and replace if it's different.

dataObject to compare to:

{
        "name": "abNotes",
        "value": "Example Notes 123456"
}

So the replaced FormData object will be changed to:

{
                    "name": "abNotes",
                    "label": "Ab Notes: (Optional)",
                    "type": "TEXT_BOX_SINGLE",
                    "value": "Example Notes 123456",
                    "active": true
}

Main object that needs to be replaced

JSON.stringify (formData);

form data::
{
    "name": "Demo",
    "fieldGroupList": [{
        "name": "instructions",
        "label": "Instructions",
        "fieldList": [{
            "name": "INSTRUCTION",
            "instructionList": [{
                "instructionText": "All enabled fields are required."
            }],
            "type": "INSTRUCTION"
        }]
    },
    {
        "name": "ab",
        "label": "Ab",
        "fieldList": [{
            "name": "abDate",
            "label": "Ab Date",
            "type": "DATE",
            "value": "1425186000000",
            "active": true
        },
        {
            "name": "abNotes",
            "label": "Ab Notes: (Optional)",
            "type": "TEXT_BOX_SINGLE",
            "value": "Example Notes",
            "active": true
        }]
    },
    {
        "name": "Record",
        "label": "Record",
        "fieldList": [{
            "name": "RecordNumber",
            "label": "Record Number: (Optional)",
            "type": "TEXT_BOX_SINGLE",
            "value": "1234567890",
            "active": true
        },
        {
            "name": "otherNumber",
            "label": "Other: (Optional)",
            "type": "TEXT_BOX_SINGLE",
            "value": "887766",
            "active": true
        },
        {
            "name": "eligibleAll",
            "instructionList": [{
                "instructionText": "Is eligible for ALL?"
            }],
            "type": "SINGLE_FROM_SET",
            "value": "true",
            "optionList": [{
                "name": "Yes",
                "value": "true"
            },
            {
                "name": "No",
                "value": "false"
            }],
            "active": true
        },
        {
            "name": "exclusionReasonCode",
            "instructionList": [{
                "instructionText": "Select from the following list of sample:"
            }],
            "type": "SINGLE_FROM_SET",
            "value": "DCS",
            "optionList": [{
                "name": "DCS",
                "value": "Test"
            }],
            "active": true
        }]
    },
    {
        "name": "bDemo",
        "label": "Demo",
        "fieldList": [{
            "name": "mId",
            "label": "M ID:",
            "type": "TEXT_BOX_SINGLE",
            "active": false
        },
        {
            "name": "firstName",
            "label": "First Name:",
            "type": "TEXT_BOX_SINGLE",
            "value": "John",
            "active": true
        },
        {
            "name": "lastName",
            "label": "Last Name",
            "type": "TEXT_BOX_SINGLE",
            "value": "Doe",
            "active": true
        },
        {
            "name": "genderCode",
            "instructionList": [{
                "instructionText": "Gender:"
            }],
            "type": "SINGLE_FROM_SET",
            "optionList": [{
                "name": "FEMALE",
                "value": "FEMALE"
            },
            {
                "name": "MALE",
                "value": "MALE"
            },
            {
                "name": "UNKNOWN",
                "value": "UNKNOWN"
            }],
            "active": true
        },
        {
            "name": "dateOfBirth",
            "label": "Date of Birth:",
            "type": "DATE",
            "value": "-157748400000",
            "active": true
        }]
    },
    {
        "name": "generalComments",
        "label": "General Comments",
        "fieldList": [{
            "name": "comments",
            "label": "Comments: (Optional)",
            "type": "TEXT_BOX_MULTIPLE",
            "value": "Comments Text Example",
            "active": true
        }]
    }],
    "Id": 1,
    "periodId": 2015,
    "orgId": 4,
    "version": 1
}

The values that I need from this object:

var dataObject = $('#'+formName).serializeArray();
console.log("data:::"+JSON.stringify(dataObject));

dataObject:::
[{
    "name": "abDate",
    "value": "Sun Mar 01 2015 00:00:00 GMT-0500 (Eastern Standard Time)"
},
{
    "name": "abNotes",
    "value": "Example Notes 123456"
},
{
    "name": "Number",
    "value": "1234567890"
},
{
    "name": "otherNumber",
    "value": "887766"
},
{
    "name": "Yes",
    "value": "true"
},
{
    "name": "No",
    "value": "false"
},
{
    "name": "DCS",
    "value": "Test"
},
{
    "name": "firstName",
    "value": "John"
},
{
    "name": "lastName",
    "value": "Doe"
},
{
    "name": "FEMALE",
    "value": "FEMALE"
},
{
    "name": "MALE",
    "value": "MALE"
},
{
    "name": "UNKNOWN",
    "value": "UNKNOWN"
},
{
    "name": "dateOfBirth",
    "value": "Fri Jan 01 1965 00:00:00 GMT-0500 (Eastern Standard Time)"
},
{
    "name": "comments",
    "value": "Comments Text Example"
}]

EDIT:

What I have tried so far:

$.extend(formData ,dataObject);
deepCopy:

function deepCopy(src, dest) { var name, value, isArray, toString = Object.prototype.toString;

// If no `dest`, create one
if (!dest) {
    isArray = toString.call(src) === "[object Array]";
    if (isArray) {
        dest = [];
        dest.length = src.length;
    }
    else { // You could have lots of checks here for other types of objects
        dest = {};
    }
}

// Loop through the props
for (name in src) {
    // If you don't want to copy inherited properties, add a `hasOwnProperty` check here
    // In our case, we only do that for arrays, but it depends on your needs
    if (!isArray || src.hasOwnProperty(name)) {
        value = src[name];
        if (typeof value === "object") {
            // Recurse
            value = deepCopy(value);
        }
        dest[name] = value;
    }
}

return dest;

}

@depperm - I have tried jquery extend and then a deepCopy function from another stackoverflow post. Both don't seem to work — Harry
– Harry, Commented Jul 28, 2015 at 19:09

Barmar · Accepted Answer · 2015-07-28 20:17:27Z

1

First, convert dataObject from an array of objects to an object that maps names to values. Then go through the main form data, replacing values from the corresponding elements of doHash.

var formData = {
  "name": "Demo",
  "fieldGroupList": [{
    "name": "instructions",
    "label": "Instructions",
    "fieldList": [{
      "name": "INSTRUCTION",
      "instructionList": [{
        "instructionText": "All enabled fields are required."
      }],
      "type": "INSTRUCTION"
    }]
  }, {
    "name": "ab",
    "label": "Ab",
    "fieldList": [{
      "name": "abDate",
      "label": "Ab Date",
      "type": "DATE",
      "value": "1425186000000",
      "active": true
    }, {
      "name": "abNotes",
      "label": "Ab Notes: (Optional)",
      "type": "TEXT_BOX_SINGLE",
      "value": "Example Notes",
      "active": true
    }]
  }, {
    "name": "Record",
    "label": "Record",
    "fieldList": [{
      "name": "RecordNumber",
      "label": "Record Number: (Optional)",
      "type": "TEXT_BOX_SINGLE",
      "value": "1234567890",
      "active": true
    }, {
      "name": "otherNumber",
      "label": "Other: (Optional)",
      "type": "TEXT_BOX_SINGLE",
      "value": "887766",
      "active": true
    }, {
      "name": "eligibleAll",
      "instructionList": [{
        "instructionText": "Is eligible for ALL?"
      }],
      "type": "SINGLE_FROM_SET",
      "value": "true",
      "optionList": [{
        "name": "Yes",
        "value": "true"
      }, {
        "name": "No",
        "value": "false"
      }],
      "active": true
    }, {
      "name": "exclusionReasonCode",
      "instructionList": [{
        "instructionText": "Select from the following list of sample:"
      }],
      "type": "SINGLE_FROM_SET",
      "value": "DCS",
      "optionList": [{
        "name": "DCS",
        "value": "Test"
      }],
      "active": true
    }]
  }, {
    "name": "bDemo",
    "label": "Demo",
    "fieldList": [{
      "name": "mId",
      "label": "M ID:",
      "type": "TEXT_BOX_SINGLE",
      "active": false
    }, {
      "name": "firstName",
      "label": "First Name:",
      "type": "TEXT_BOX_SINGLE",
      "value": "John",
      "active": true
    }, {
      "name": "lastName",
      "label": "Last Name",
      "type": "TEXT_BOX_SINGLE",
      "value": "Doe",
      "active": true
    }, {
      "name": "genderCode",
      "instructionList": [{
        "instructionText": "Gender:"
      }],
      "type": "SINGLE_FROM_SET",
      "optionList": [{
        "name": "FEMALE",
        "value": "FEMALE"
      }, {
        "name": "MALE",
        "value": "MALE"
      }, {
        "name": "UNKNOWN",
        "value": "UNKNOWN"
      }],
      "active": true
    }, {
      "name": "dateOfBirth",
      "label": "Date of Birth:",
      "type": "DATE",
      "value": "-157748400000",
      "active": true
    }]
  }, {
    "name": "generalComments",
    "label": "General Comments",
    "fieldList": [{
      "name": "comments",
      "label": "Comments: (Optional)",
      "type": "TEXT_BOX_MULTIPLE",
      "value": "Comments Text Example",
      "active": true
    }]
  }],
  "Id": 1,
  "periodId": 2015,
  "orgId": 4,
  "version": 1
};

var dataObject = [{
  "name": "abDate",
  "value": "Sun Mar 01 2015 00:00:00 GMT-0500 (Eastern Standard Time)"
}, {
  "name": "abNotes",
  "value": "Example Notes 123456"
}, {
  "name": "Number",
  "value": "1234567890"
}, {
  "name": "otherNumber",
  "value": "887766"
}, {
  "name": "Yes",
  "value": "true"
}, {
  "name": "No",
  "value": "false"
}, {
  "name": "DCS",
  "value": "Test"
}, {
  "name": "firstName",
  "value": "John"
}, {
  "name": "lastName",
  "value": "Doe"
}, {
  "name": "FEMALE",
  "value": "FEMALE"
}, {
  "name": "MALE",
  "value": "MALE"
}, {
  "name": "UNKNOWN",
  "value": "UNKNOWN"
}, {
  "name": "dateOfBirth",
  "value": "Fri Jan 01 1965 00:00:00 GMT-0500 (Eastern Standard Time)"
}, {
  "name": "comments",
  "value": "Comments Text Example"
}];

var doHash = {};
$.each(dataObject, function() {
  doHash[this.name] = this.value;
});



$.each(formData.fieldGroupList, function() {
  $.each(this.fieldList, function() {
    if (this.name in doHash) {
      this.value = doHash[this.name];
    }
  });
});

console.log(JSON.stringify(formData));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

edited Jul 28, 2015 at 20:17

answered Jul 28, 2015 at 19:16

Barmar

789k57 gold badges554 silver badges669 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Harry Over a year ago

Unfortunately it's not working :( I just copied your code to jsfiddle. Not working :( jsfiddle.net/prLxfkca

Harry Over a year ago

Also the code snippet doesn't show the desired output.

Barmar Over a year ago

I didn't see before that the objects you wanted to replace were another level down in the fieldList. I've updated the code.

Harry Over a year ago

Awesome. Looks like the snippet works fine. But my code doesn't. Error: Uncaught TypeError: Cannot use 'in' operator to search for '686' in [.....] isArraylike @ jquery-1.10.2.js:997jQuery.extend.each @ jquery-1.10.2.js:632buttonSave.onclick. Is it because I'm using jquery-1.10.2.js?

Barmar Over a year ago

No, it looks like you're not using in with the object that I created in my code.

|

Collectives™ on Stack Overflow

Jquery Javascript object - compare and replace some of the values with another similar object

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related