Find element by id and append in object

Question

I've been trying to figure out a way of doing this. This is my object:

    {
   "id":1,
   "name":"Blooper Corp.",
   "emoji":"",
   "parent_id":null,
   "children":[
      {
         "id":2,
         "name":"Food",
         "emoji":"",
         "parent_id":1,
         "children":[

         ]
      },
      {
         "id":3,
         "name":"Canine Therapy",
         "emoji":"",
         "parent_id":1,
         "children":[
            {
               "id":4,
               "name":"Massages",
               "emoji":"",
               "parent_id":3,
               "children":[

               ]
            },
            {
               "id":5,
               "name":"Games",
               "emoji":"",
               "parent_id":3,
               "children":[

               ]
            }
         ]
      }
   ]
}

I'm trying to get the last id of the array so I can use it in the new child array and add it as a child to that specific tier, for example:

{
  "id":6, // New id
  "name":"Music",
  "emoji":"",
  "parent_id":4, //this will be the parent id it belongs to
  "children":[

  ]
}

This is my javascript button function:

function askUserForTeamDetails( team ) {
    const emoji = prompt( 'Enter new team’s emoji:' );
    if ( null === emoji ) {
        return;
    }
    const name = prompt( 'Enter new team’s name:' );
    if ( null === name ) {
        return;
    }
    let tree = getTree();
    tree.id = {}; //new child array to push depending on parent id

    return { name, emoji };
}

getTree():

const tree = {"id":1,"name":"Rusty Corp.","emoji":"","parent_id":null,"children":[{"id":2,"name":"Food","emoji":"","parent_id":1,"children":[]},{"id":3,"name":"Canine Therapy","emoji":"","parent_id":1,"children":[{"id":4,"name":"Massages","emoji":"","parent_id":3,"children":[]},{"id":5,"name":"Games","emoji":"","parent_id":3,"children":[]}]}]};
return tree;

I've tried using Object.keys(tree)[Object.keys(tree).length-1]; But I don't see how this will work since it's multidimensional.

I hope someone can advise a way of doing this.

Thanks

@nixkuroi it is just fetching the JSON from a global javascript variable. I have added it in. — designtocode, Oct 24 '19 at 18:57
If the last id is 5 why is `"parent_id"` 4 in that new object? — Nenad Vracar, Oct 24 '19 at 18:59
Please read the usage description of the `json` tag, especially the part in CAPS. — trincot, Oct 24 '19 at 19:00
@NenadVracar the `parent_id` can be the parent id it belongs to. There id 6 is a child of 4 in the example. — designtocode, Oct 24 '19 at 19:01
I'm not too sure what you are referring to @trincot please can you explain. — designtocode, Oct 24 '19 at 19:03
Is the result of `getTree()` supposed to be an array? Because right now it's an object and you can't use `push` on an object. Also how do you identify if a new team is a child of another? There's no option to add it as a child. — Matt Croak, Oct 24 '19 at 19:04
@designtocode the JSON tag is not appropriate for javascript object literals, which is the only "JSON" in your question. I have removed it from the question. — Ruzihm, Oct 24 '19 at 19:04

Nenad Vracar · Accepted Answer · 2019-10-24T19:41:11.037

2

If you want to add new object based on parent_id property that can be on any level, you can create recursive function that will traverse the object with for...in loop and push the object to children if the id matches.

const data = {"id":1,"name":"Blooper Corp.","emoji":"","parent_id":null,"children":[{"id":2,"name":"Food","emoji":"","parent_id":1,"children":[]},{"id":3,"name":"Canine Therapy","emoji":"","parent_id":1,"children":[{"id":4,"name":"Massages","emoji":"","parent_id":3,"children":[]},{"id":5,"name":"Games","emoji":"","parent_id":3,"children":[]}]}]}

function insert(data, obj, pid = null) {
  if (pid == obj.parent_id) {
    data.children.push(obj);
    return;
  }

  if (data.children) {
    data.children.forEach(e => insert(e, obj, e.id))
  }
}

function getLastId(data) {
  let result = null;

  function search(data) {
    if (!result || data.id > result) result = data.id;
    if (data.children)  data.children.forEach(search);
  }

  search(data);
  return result;
}

const newObj = {
  "id": getLastId(data) + 1,
  "name": "Music",
  "emoji": "",
  "parent_id": 4,
  "children": []
}

insert(data, newObj);
console.log(data)

edited Oct 24 '19 at 19:41

answered Oct 24 '19 at 19:13

Nenad Vracar

118,580
15
151
176

This works but I wanted to also try find a way to generate the new id. The new object has id 6, because the last highest object id is 5. I hope this makes sense. – designtocode Oct 24 '19 at 19:25
So why isn't the `parent_id` 5 then instead of 4? – Nenad Vracar Oct 24 '19 at 19:26
That is just the parent id. It just shows which parent it belongs to. The new object needs its own id and must be unique. – designtocode Oct 24 '19 at 19:29
Take a look at https://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript – Nenad Vracar Oct 24 '19 at 19:32
Thanks @NenadVracar I was hoping to try find a way to +1 the last id in the object tree. – designtocode Oct 24 '19 at 19:37

score 0 · Answer 2 · answered Oct 24 '19 at 19:17

You could write a recursive function that would loop over each of the children until the id was found. One way of doing this could be:

function findTeamById(id, tree) {
  if (id === tree.id) return tree //returning tree as it is the current team's object
  for (let i = 0; i < tree.length; i++) {
    let teamTree = findTeamById(id, tree[i])
    if (teamTree !== false) {
      // return the found tree
      return teamTree
    }
  }
  // if no tree was found return false
  return false
}
// EDIT: forgot to show how to add the child
const newTeam = {
  "id":6, // New id
  "name":"Music",
  "emoji":"",
  "parent_id":4, //this will be the parent id it belongs to
  "children":[

  ]
}

// this will push the new team to the childrens array of the newTeams parent
findTeamById(newTeam.parent_id, myTree).children.push(newTeam)

score 0 · Answer 3 · answered Oct 24 '19 at 19:39

It seems like you'll need a recursive function to find the max ID, then get the parent of that maxID object and put the new object in its children.

const tree = {"id":1,"name":"Rusty Corp.","emoji":"","parent_id":null,"children":[{"id":2,"name":"Food","emoji":"","parent_id":1,"children":[]},{"id":3,"name":"Canine Therapy","emoji":"","parent_id":1,"children":[{"id":4,"name":"Massages","emoji":"","parent_id":3,"children":[]},{"id":5,"name":"Games","emoji":"","parent_id":3,"children":[]}]}]};


const newObj = {
  "id": 6,
  "name": "Music",
  "emoji": "",
  "parent_id": 0,
  "children": []
}

var maxID=0;
var parentObj = null; 
function findMaxIDArray(obj) {
  var tmpid = maxID;
  maxID = Math.max(obj.id, maxID);
  if (maxID>tmpid) {
      parentObj = obj;
  }
  if (obj.children) {
    for(let c=0;c<obj.children.length;c++){
      if (obj.children[c]) {
         findMaxIDArray(obj.children[c]);
      }
    }
  }  
}



findMaxIDArray(tree);

if (parentObj) {
  newObj.parent_id=parentObj.id;
  parentObj.children.push(newObj);
}

console.log(tree);

Find element by id and append in object

3 Answers3