Parse json array and loop through all the data for Pivot.js

Question

I have a json array data in this format:

{
  "jobs": [
    {
      "id": "some_random_id_1",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 40,
        "rejected": 20
      }
    },
    {
      "id": "some_random_id_2",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 30,
        "rejected": 20
      }
    },
    {
      "id": "some_random_id_3",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 13,
        "rejected": 1
      }
    },
    {
      "id": "some_random_id_4",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 13,
        "rejected": 1
      }
    }
  ],
  "job_id": "some_id",
  "total_jobs": 60
}

where I just need to access the jobs object and grab id and status and all info for job_fields and stats (or all info for now).

  // example is from here
  // https://pivottable.js.org/examples/mps.html
  $(function(){
    $.getJSON("data.json", function(mps) {
        $("#output").pivotUI(mps);
    });
 });

the example works with this json format:

[{
    "Province": "Quebec",
    "Party": "NDP",
    "Age": 22,
    "Name": "Liu, Laurin",
    "Gender": "Female"
  },
  {
    "Province": "Quebec",
    "Party": "Bloc Quebecois",
    "Age": 43,
    "Name": "Mourani, Maria",
    "Gender": "Female"
  },
  {
    "Province": "Ontario",
    "Party": "Conservative",
    "Age": "",
    "Name": "O'Toole, Erin",
    "Gender": "Male"
  }
]

I am not sure how to modify the javascript so it can read my json format. I can't modify the json format to match the above format, so in the above javascript example, province, party, etc are all passed to the function.

I want to do the same but with my json format, so output id, status, all members of job_fields (ex: TITLE, etc. ), all members of stats (ex: applied, rejected.

Answer 1

$("#output").pivotUI(mps.jobs);

Answer 2

You can use map and use Object.assign and spread operator to make an object

var obj={"jobs":[{"id":"some_random_id_1","email":"some@email.com","email_type":"html","status":"pending","job_fields":{"TITLE":"job title here"},"stats":{"applied":40,"rejected":20}},{"id":"some_random_id_2","email":"some@email.com","email_type":"html","status":"pending","job_fields":{"TITLE":"job title here"},"stats":{"applied":30,"rejected":20}},{"id":"some_random_id_3","email":"some@email.com","email_type":"html","status":"pending","job_fields":{"TITLE":"job title here"},"stats":{"applied":13,"rejected":1}},{"id":"some_random_id_4","email":"some@email.com","email_type":"html","status":"pending","job_fields":{"TITLE":"job title here"},"stats":{"applied":13,"rejected":1}}],"job_id":"some_id","total_jobs":60}

var result = obj.jobs.map(({id,status,job_fields,stats}) => {
  return Object.assign({}, {id}, {status}, {...job_fields}, {...stats});
});

console.log(result);

Or you can make it shorter like:

var result = obj.jobs.map( ({id,status,job_fields,stats}) => Object.assign({},{id},{status},{...job_fields},{...stats}) );

Answer 3

Can try with below snippet:

$(function(){
$.getJSON("data.json", function(orgData) {
    var pivotData = [];
    orgData.jobs.forEach(function (job, ind) {
        var reqInfo = {};
        reqInfo['id'] = job.id;
        reqInfo['status'] = job.status;
        reqInfo['jobTitle'] = job.job_fields && job.job_fields.TITLE;
        reqInfo['applied'] = job.stats && job.stats.applied;
        reqInfo['rejected'] = job.stats && job.stats.rejected;
        pivotData.push(reqInfo)
    })
    $("#output").pivotUI(pivotData);
});

});

Answer 4

Assuming all jobs have job_fields.TITLE, stats.applied and stats.rejected maybe the following will do:

const json = {
  "jobs": [
    {
      "id": "some_random_id_1",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 40,
        "rejected": 20
      }
    },
    {
      "id": "some_random_id_2",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 30,
        "rejected": 20
      }
    },
    {
      "id": "some_random_id_3",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 13,
        "rejected": 1
      }
    },
    {
      "id": "some_random_id_4",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 13,
        "rejected": 1
      }
    }
  ],
  "job_id": "some_id",
  "total_jobs": 60
};

console.log(
  json.jobs.map(
    (job)=>({
      id:job.id,
      status:job.status,
      title:job.job_fields.TITLE,
      applied:job.stats.applied,
      rejected:job.stats.rejected
    })
  )
);