how to transform json data in javascript

Question

I am trying to transform data using datascript function.but I am not able to add children in array of it's parent.

var a ={
            "GENERAL_INFORMATION": {
              "value": null,
              "type": "LABEL",
              "editable": false,
              "dataType": null,
              "required": false,
              "displayName": null,
              "pattern": null
            },
            " NUMBER": {
              "value": "9876834940",
              "type": "FIELD",
              "editable": false,
              "dataType": "",
              "required": false,
              "displayName": null,
              "pattern": null
            },
            "CON TYPE": {
              "value": "retailnn_cyn",
              "type": "FIELD",
              "editable": false,
              "dataType": "",
              "required": false,
              "displayName": null,
              "pattern": null
            },
            "User INFORMATION": {
              "value": null,
              "type": "LABEL",
              "editable": false,
              "dataType": null,
              "required": false,
              "displayName": null,
              "pattern": null
            },
            "Title": {
              "value": "Mr",
              "type": "FIELD",
              "editable": true,
              "dataType": "",
              "required": true,
              "displayName": null,
              "pattern": null
            },
            "Gender": {
              "value": "M",
              "type": "FIELD",
              "editable": true,
              "dataType": "",
              "required": true,
              "displayName": null,
              "pattern": null
            },
            "DOB": {
              "value": "23-Oct-1984",
              "type": "FIELD",
              "editable": true,
              "dataType": "DATE",
              "required": true,
              "displayName": null,
              "pattern": null
            }
    };




    var o = [];

    for (var i in a){
      if(a[i].type==='LABEL'){
        a[i].text = i;
        a[i].children = []
        o.push(a[i])
      }else if(a[i].type==='FIELD'){

      }

    }

getting output;

[{
    "value": null,
    "type": "LABEL",
    "editable": false,
    "dataType": null,
    "required": false,
    "displayName": null,
    "pattern": null,
    "text": "GENERAL_INFORMATION",
    "children": []
}, {
    "value": null,
    "type": "LABEL",
    "editable": false,
    "dataType": null,
    "required": false,
    "displayName": null,
    "pattern": null,
    "text": "User INFORMATION",
    "children": []
}]

Expected output

[{
    "value": null,
    "type": "LABEL",
    "editable": false,
    "dataType": null,
    "required": false,
    "displayName": null,
    "pattern": null,
    "text": "GENERAL_INFORMATION",
    "children": [
      {
          "value": "9876834940",
          "type": "FIELD",
          "editable": false,
          "dataType": "",
          "required": false,
          "displayName": null,
          "pattern": null,
        "text": "NUMBER",
        },
     {
          "value": "retailnn_cyn",
          "type": "FIELD",
          "editable": false,
          "dataType": "",
          "required": false,
          "displayName": null,
          "pattern": null,
       "text": "CON TYPE",
        }
    ]
}, {
    "value": null,
    "type": "LABEL",
    "editable": false,
    "dataType": null,
    "required": false,
    "displayName": null,
    "pattern": null,
    "text": "User INFORMATION",
    "children": [
      {
          "value": "Mr",
          "type": "FIELD",
          "editable": true,
          "dataType": "",
          "required": true,
          "displayName": null,
          "pattern": null,
        "text": "Title",
        },
      {
          "value": "M",
          "type": "FIELD",
          "editable": true,
          "dataType": "",
          "required": true,
          "displayName": null,
          "pattern": null,
          "text": "Gender",
        },
         {
          "value": "23-Oct-1984",
          "type": "FIELD",
          "editable": true,
          "dataType": "",
          "required": true,
          "displayName": null,
          "pattern": null,
          "text": "DOB",
        }
    ]
}]



console.log(JSON.stringify(o))

here is my code https://jsbin.com/wofufuriqe/2/edit?html,js,console

there is no common ground to map items to children, all i can deduce is that, the direct elements (type: 'FIELD') coming after type: 'LABEL' should become children of the previous type: 'LABEL' element. Is that so? — boop_the_snoot
– boop_the_snoot, Commented Sep 10, 2019 at 3:34
What is the foreign key for the children or logic needed to create them? Also what does "datascript function" mean? — ctaleck
– ctaleck, Commented Sep 10, 2019 at 3:37
@g̖͖ͧ̅̾̄l̊͒ͪī̳̪̫̣̮͔ͯt̔̿ͯc̘̹ͅȟ yes correct ..!! — user944513
– user944513, Commented Sep 10, 2019 at 5:02

marc_s · Accepted Answer · 2019-09-27 12:37:45Z

Your code update the a element, not sure if it's a god idea...

This is "my solution": (I changed names a, o)

const Primo = { 'GENERAL_INFORMATION': 
                  { value      : null
                  , type       : 'LABEL'
                  , editable   : false
                  , dataType   : null
                  , required   : false
                  , displayName: null
                  , pattern    : null
                  } 
              , 'NUMBER': 
                  { value      : '9876834940'
                  , type       : 'FIELD'
                  , editable   : false
                  , dataType   : ''
                  , required   : false
                  , displayName: null
                  , pattern    : null
                  } 
              , 'CON TYPE': 
                  { value      : 'retailnn_cyn'
                  , type       : 'FIELD'
                  , editable   : false
                  , dataType   : ''
                  , required   : false
                  , displayName: null
                  , pattern    : null
                  } 
              , 'User INFORMATION': 
                  { value      : null
                  , type       : 'LABEL'
                  , editable   : false
                  , dataType   : null
                  , required   : false
                  , displayName: null
                  , pattern    : null
                  } 
              , 'Title': 
                  { value      : 'Mr'
                  , type       : 'FIELD'
                  , editable   : true
                  , dataType   : ''
                  , required   : true
                  , displayName: null
                  , pattern    : null
                  } 
              , 'Gender': 
                  { value      : 'M'
                  , type       : 'FIELD'
                  , editable   : true
                  , dataType   : ''
                  , required   : true
                  , displayName: null
                  , pattern    : null
                  } 
              , 'DOB': 
                  { value      : '23-Oct-1984'
                  , type       : 'FIELD'
                  , editable   : true
                  , dataType   : 'DATE'
                  , required   : true
                  , displayName: null
                  , pattern    : null
                  } 
              } 
let res = []
  , Elm = null

for (let item in Primo)
  {
  let e1  = Object.assign({}, Primo[item])
  e1.text = item
  if (e1.type === 'LABEL')
    {
    Elm         = e1
    e1.children = []
    res.push(e1)
    }
  else if(e1.type === 'FIELD')
    {
    Elm.children.push(e1)
    }
  }
  
console.log( res )

Michael · Accepted Answer · 2019-09-10 03:52:44Z

The code you presented currently has nothing to handle adding children to the parent data.

You'll need to have some way to reference the parent to add the children to it, so one thing you could do is build that up before pushing to the array.

var o = [];
var parent = {}
for (var i in a){
  if(a[i].type==='LABEL'){
    if (parent.hasOwnProperty('children')) o.push(parent) 
    parent = a[i]
    parent.text = i;
    parent.children = []
  }else if(a[i].type==='FIELD'){
    parent.children.push(a[i])
  }
}
o.push(parent)

console.log(o)

This pretty heavily relies on the data in a always coming in the form of label objects followed by its associated field objects. It's pretty brittle, but it's the easiest way to fix your code while preserving what you were initially doing.

Arosha · Accepted Answer · 2019-09-10 05:09:42Z

First thing I have to say is there is no guarantee that those set of objects are in this order when you start to process it. I strongly recommend to add a property to objects with type 'FIELD' to identify its parent. Let's say you have added field 'parentKey' to all 'FIELD' object specifying their parent. Ex: parentKey: 'GENERAL_INFORMATION' Then your code will look like below.

let a = {
  "GENERAL_INFORMATION": {
    "value": null,
    "type": "LABEL",
    "editable": false,
    "dataType": null,
    "required": false,
    "displayName": null,
    "pattern": null
  },
  " NUMBER": {
    "parentKey": "GENERAL_INFORMATION",
    "value": "9876834940",
    "type": "FIELD",
    "editable": false,
    "dataType": "",
    "required": false,
    "displayName": null,
    "pattern": null
  },
  "CON TYPE": {
    "parentKey": "GENERAL_INFORMATION",
    "value": "retailnn_cyn",
    "type": "FIELD",
    "editable": false,
    "dataType": "",
    "required": false,
    "displayName": null,
    "pattern": null
  },
  "User INFORMATION": {
    "value": null,
    "type": "LABEL",
    "editable": false,
    "dataType": null,
    "required": false,
    "displayName": null,
    "pattern": null
  },
  "Title": {
    "parentKey": "User INFORMATION",
    "value": "Mr",
    "type": "FIELD",
    "editable": true,
    "dataType": "",
    "required": true,
    "displayName": null,
    "pattern": null
  },
  "Gender": {
    "parentKey": "User INFORMATION",
    "value": "M",
    "type": "FIELD",
    "editable": true,
    "dataType": "",
    "required": true,
    "displayName": null,
    "pattern": null
  },
  "DOB": {
    "parentKey": "User INFORMATION",
    "value": "23-Oct-1984",
    "type": "FIELD",
    "editable": true,
    "dataType": "DATE",
    "required": true,
    "displayName": null,
    "pattern": null
  }
};

let o = [];

// Modifying the object as you prefer
for (let i in a) {
  if (!a.hasOwnProperty(i)) continue;

  if (a[i].type === 'LABEL') {
    a[i].text = i;
  } else {
    let parentObj = a[a[i].parentKey];
    parentObj.children = parentObj.children ? parentObj.children : [];
    parentObj.children.push(a[i]);
  }
}

// Push parent objects to array
for (let i in a) {
  if (!a.hasOwnProperty(i)) continue;

  if (a[i].type === 'LABEL') {
    o.push(a[i]);
  }
}

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

This way you can guarantee you get desired output 100%.

Collectives™ on Stack Overflow

how to transform json data in javascript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related