SBB SBB - 8 days ago 4
Javascript Question

Modify JSON string with javascript

I have a JSON string that is hard-coded into my page, it is used for settings in my application.

There is a use case where I need to add an option to those settings if a value is true.

From my psuedo code below, I am trying to add a "setting" to the main string if a value is true.

I tried to store the JSON as an array and then push my new data into it but java-script complained it wasn't in the right format.

How can I add the additional json data to my main string?

var v = true,
test = {
"copySelected": {
"name": "Copy",
"icon": "fa-files-o"
},
"sep1": "---------",
"success": {
"name": "Highlight: Green",
"icon": "fa-pencil"
},
"info": {
"name": "Highlight: Blue",
"icon": "fa-pencil"
},
"warning": {
"name": "Highlight: Yellow",
"icon": "fa-pencil"
},
"danger": {
"name": "Highlight: Red",
"icon": "fa-pencil"
},
"sep2": "---------",
"remove": {
"name": "Remove Highlight",
"icon": "fa-eraser"
},
"sep3": "---------",
"addNote": {
"name": "Add Note",
"icon": "fa-file-text-o"
}
}

// I need to add this section to the above json at the end
if(v){

"sep4": "---------",
"removeUser": {
"name": "Remove User",
"icon": "fa-user-times"
}

}

Answer

What you are showing is just a regular JavaScript Object. Just add properties to it as normal:

    var v = true, 
    test = {
    "copySelected": {
        "name": "Copy",
        "icon": "fa-files-o"
    },
    "sep1": "---------",
    "success": {
        "name": "Highlight: Green",
        "icon": "fa-pencil"
    },
    "info": {
        "name": "Highlight: Blue",
        "icon": "fa-pencil"
    },
    "warning": {
        "name": "Highlight: Yellow",
        "icon": "fa-pencil"
    },
    "danger": {
        "name": "Highlight: Red",
        "icon": "fa-pencil"
    },
    "sep2": "---------",
    "remove": {
        "name": "Remove Highlight",
        "icon": "fa-eraser"
    },
    "sep3": "---------",
    "addNote": {
        "name": "Add Note",
        "icon": "fa-file-text-o"
    }
}

// I need to add this section to the above json at the end
if(v){

  test.sep4 =  "---------";
  test.removeUser = {
      name: "Remove User",
      icon: "fa-user-times"
  };

}

console.log(test.sep4)
console.log(test.removeUser);

If you had received a JSON string, then you'd simply call JSON.parse(string) and the return value would be an object that you would then just add properties to as shown here. (NOTE: the object is now encapsulated in quotes and is just a string.)

        var v = true, 
        test = `{
        "copySelected": {
            "name": "Copy",
            "icon": "fa-files-o"
        },
        "sep1": "---------",
        "success": {
            "name": "Highlight: Green",
            "icon": "fa-pencil"
        },
        "info": {
            "name": "Highlight: Blue",
            "icon": "fa-pencil"
        },
        "warning": {
            "name": "Highlight: Yellow",
            "icon": "fa-pencil"
        },
        "danger": {
            "name": "Highlight: Red",
            "icon": "fa-pencil"
        },
        "sep2": "---------",
        "remove": {
            "name": "Remove Highlight",
            "icon": "fa-eraser"
        },
        "sep3": "---------",
        "addNote": {
            "name": "Add Note",
            "icon": "fa-file-text-o"
        }
    }`
    
    var result = JSON.parse(test);

    // I need to add this section to the above json at the end
    if(v){

      result.sep4 =  "---------";
      result.removeUser = {
          name: "Remove User",
          icon: "fa-user-times"
      };

    }

    console.log(result.sep4)
    console.log(result.removeUser);