How to search value in Nested Json in JavaScript

Question

What i need

• I need to search parent_id with id column in children object.

Json object

                    {
                       "key":"1",
                       "value":{
                          "id":"150",
                          "code":"p",
                          "name":"Parent / Node",
                          "parent_id":null,
                          "url":"parent-url",
                          "children":[
                             {
                                "id":"151",
                                "code":"A",
                                "name":"A",
                                "parent_id":"150",
                                "url":"a-test"
                             },
                             {
                                "id":"152",
                                "code":"B",
                                "name":"B",
                                "parent_id":"150",
                                "url":"b-test"
                             },
                             {
                                "id":"153",
                                "code":"Comm",
                                "name":"Comm",
                                "parent_id":"150",
                                "url":"c-test",
                                "children":[
                                   {
                                      "id":"154",
                                      "code":"c_code",
                                      "name":"comm Code",
                                      "parent_id":"153",
                                      "url":"comm-codes"
                                   },
                                   {
                                      "id":"155",
                                      "code":"forms_c",
                                      "name":"Forms Code",
                                      "parent_id":"153",
                                      "url":"form-cod",
                                      "children":[
                                         {
                                            "id":"156",
                                            "code":"test UME",
                                            "name":"Test  Menu",
                                            "parent_id":"155",
                                            "url":"test-menu"
                                         }
                                      ]
                                   }
                                ]
                             }
                          ]
                       }
                    }

Js code

        console.log(searchNode('153',this.childernNodes));

   
            function searchNode(id, currentNode) {
            var i,
                currentChild,
                result;
            //console.log(currentNode);
            // if (id == currentNode.parent_id) {
            //     return currentNode;
            // } else {

               
                for (i = 0; i < currentNode.length; i ++) {
                 
                    currentChild = currentNode[i].node;
           
                    result = searchNode(id, currentChild);
                     
                  
                     return result;
                  
                }

             
        }

Input

this.childernNodes object json. 

Use case

* Case 1 when user  click on menu option i have id and parent_id of clicked  item.

* Suppose  153 selected item then i need recreate json according to clicked menu options  

Output should be like

* Parent / Node >Comm>Comm Code

• Stack blitz

https://stackblitz.com/edit/angular-tree-node-test-qce9cv

Answer 1

I don't think the accepted answer is correct. I would expect two results to be returned for the parent_id 153.

Here is an iterative solution using object-scan. It seems a bit cleaner to me than using the accepted answer, but I'm also not sure what you are trying to achieve as your question is very unclear. I can definitely adjust this answer if you explain better what your goal is.

// const objectScan = require('object-scan');

const myData = {"key":"1","value":{"id":"150","code":"p","name":"Parent / Node","parent_id":null,"url":"parent-url","children":[{"id":"151","code":"A","name":"A","parent_id":"150","url":"a-test"},{"id":"152","code":"B","name":"B","parent_id":"150","url":"b-test"},{"id":"153","code":"Comm","name":"Comm","parent_id":"150","url":"c-test","children":[{"id":"154","code":"c_code","name":"comm Code","parent_id":"153","url":"comm-codes"},{"id":"155","code":"forms_c","name":"Forms Code","parent_id":"153","url":"form-cod","children":[{"id":"156","code":"test UME","name":"Test Menu","parent_id":"155","url":"test-menu"}]}]}]}};

const searchNode = (data, id) => objectScan(['**.parent_id'], {
  rtn: 'parent',
  filterFn: ({ value }) => value === id
})(data);

console.log(searchNode(myData, '153'));
/* => [
  { id: '155', code: 'forms_c', name: 'Forms Code', parent_id: '153', url: 'form-cod', children: [
    { id: '156', code: 'test UME', name: 'Test Menu', parent_id: '155', url: 'test-menu' }
  ] },
  { id: '154', code: 'c_code', name: 'comm Code', parent_id: '153', url: 'comm-codes' }
]
 */

.as-console-wrapper {max-height: 100% !important; top: 0}

<script src="https://bundle.run/object-scan@13.8.0"></script>

Disclaimer: I'm the author of object-scan

Answer 2

Your given function is for DOM, cuz it's using DOM api (.node). Here you go, it's not perfect, but it's working example for you how you can do it:

var data =                     {
                       "key":"1",
                       "value":{
                          "id":"150",
                          "code":"p",
                          "name":"Parent / Node",
                          "parent_id":null,
                          "url":"parent-url",
                          "children":[
                             {
                                "id":"151",
                                "code":"A",
                                "name":"A",
                                "parent_id":"150",
                                "url":"a-test"
                             },
                             {
                                "id":"152",
                                "code":"B",
                                "name":"B",
                                "parent_id":"150",
                                "url":"b-test"
                             },
                             {
                                "id":"153",
                                "code":"Comm",
                                "name":"Comm",
                                "parent_id":"150",
                                "url":"c-test",
                                "children":[
                                   {
                                      "id":"154",
                                      "code":"c_code",
                                      "name":"comm Code",
                                      "parent_id":"153",
                                      "url":"comm-codes"
                                   },
                                   {
                                      "id":"155",
                                      "code":"forms_c",
                                      "name":"Forms Code",
                                      "parent_id":"153",
                                      "url":"form-cod",
                                      "children":[
                                         {
                                            "id":"156",
                                            "code":"test UME",
                                            "name":"Test  Menu",
                                            "parent_id":"155",
                                            "url":"test-menu"
                                         }
                                      ]
                                   }
                                ]
                             }
                          ]
                       }
                    };
                    
        console.log(searchNode('153',data));

   
            function searchNode(id, currentNode) {
            var result;
               
                for (const [key, value] of Object.entries(currentNode)) {
                if (key == "parent_id" && value == id)  return currentNode;
                    if (value !== null && typeof value === "object" || typeof value === "array") {
                        result = searchNode(id, value);
                       if (result) {
                        return result;
                       }
                     }
                  
                }
             
        }