Display JSON response from ajax as HTML or table - javascript

Code to display json data
$('body').on('click','#check_history',function () {
var settings = {
"async": true,
"crossDomain": true,
"url": "https://url.com",
"method": "POST",
"headers": {
"content-type": "application/x-www-form-urlencoded",
"cache-control": "no-cache",
"postman-token": "bla-bla-bla-bla"
},
"data": {
"userid": "this-is-userid",
"to": "destination",
"count": "5"
}
}
$.ajax(settings).done(function (response) {
console.log(response);
//I think I need some code here
});
});
I get the below JSON response from an AJAX in console
{
"status": 0,
"trxid": "101010101",
"billpayQueryState": false,
"billpayState": false,
"trxList": [{
"date": "16/1/2017 11:51",
"transid": 1010101010,
"type": "merchant_buy",
"amount": 3500,
"agent": "abc"
}, {
"date": "16/1/2017 11:25",
"transid": 2020202020,
"type": "merchant_buy",
"amount": 4500,
"agent": "abc"
}, {
"date": "16/1/2017 11:5",
"transid": 3030303030,
"type": "merchant_buy",
"amount": 4500,
"agent": "abc"
}, {
"date": "16/1/2017 10:55",
"transid": 4040404040,
"type": "merchant_buy",
"amount": 5000,
"agent": "abc"
}, {
"date": "16/1/2017 10:39",
"transid": 5050505050,
"type": "merchant_buy",
"amount": 5500,
"agent": "abc"
}],
"agentData": {
"walletType": 0,
"isWaitingForKyc": false,
"isAllowToKyc": false,
"isOutlet": false
}
}
I need to display the JSON data above, to a table or html which easy to read by humans. I've tried in many ways from google & stackoverflow, but has not solved my problem. How can I do it? Please help!

Simple map over the response and append the data to the table.
$(function() {
var response = {
"status": 0,
"trxid": "101010101",
"billpayQueryState": false,
"billpayState": false,
"trxList": [{
"date": "16/1/2017 11:51",
"transid": 1010101010,
"type": "merchant_buy",
"amount": 3500,
"agent": "abc"
}, {
"date": "16/1/2017 11:25",
"transid": 2020202020,
"type": "merchant_buy",
"amount": 4500,
"agent": "abc"
}, {
"date": "16/1/2017 11:5",
"transid": 3030303030,
"type": "merchant_buy",
"amount": 4500,
"agent": "abc"
}, {
"date": "16/1/2017 10:55",
"transid": 4040404040,
"type": "merchant_buy",
"amount": 5000,
"agent": "abc"
}, {
"date": "16/1/2017 10:39",
"transid": 5050505050,
"type": "merchant_buy",
"amount": 5500,
"agent": "abc"
}],
"agentData": {
"walletType": 0,
"isWaitingForKyc": false,
"isAllowToKyc": false,
"isOutlet": false
}
}
$.map(response.trxList, function(val, i) {
var htm = '<tr><td>' + val.date + '</td><td>' + val.transid + '</td><td>' + val.type + '</td><td>' + val.amount + '</td><td>' + val.agent + '</td></tr>';
$('#table').append(htm);
})
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table"></table>

Related

Javascript: Get value of json string

I have this JSON string:
var json = {
"cdl": {
"06A78000000YNR7EAO": {
"attributes": {
"type": "CDL",
"url": "/services/data"
},
"CDI": "06978000000GIjCAAW",
"LEI": "a1U78000000SUtTEAW",
"Id": "06A78000000YNR7EAO",
"CD": {
"attributes": {
"type": "CD",
"url": "/services/data"
},
"Title": "photo-1517849845537-4d257902454a",
"Id": "06978000000GIjCAAW"
}
},
"06A78000000YNPGEA4": {
"attributes": {
"type": "CDL",
"url": "/services/data"
},
"CDI": "06978000000GIhuAAG",
"LEI": "a1U78000000SUtOEAW",
"Id": "06A78000000YNPGEA4",
"CD": {
"attributes": {
"type": "CD",
"url": "/services/data"
},
"Title": "photo-1517519014922-8fc06b814a0e",
"Id": "06978000000GIhuAAG"
}
}
},
"documents": {
"a1U78000000SUtTEAW": {
"attributes": {
"type": "DR",
"url": "/services/data"
},
"Id": "a1U78000000SUtTEAW",
"Name": "test2"
},
"a1U78000000SUtOEAW": {
"attributes": {
"type": "DR",
"url": "/services/data"
},
"Id": "a1U78000000SUtOEAW",
"Name": "test"
}
}
}
I can access to the document name like this:
console.log(Object.values(json)[1]["a1U78000000SUtTEAW"]["Name"]);
how can i know how much documents are and how can i get the name without using "a1U78000000SUtTEAW"?
try this
Object.keys(json.documents).forEach(key => {
console.log("\n" + key + ": " + json.documents[key].Name);
});
or this
var documents= Object.values(json.documents);
console.log(documents.length); //2
console.log(documents[0].Id); // a1U78000000SUtTEAW
console.log(documents[0].Name); // test2

Related content from JSON & API

i have a json returned from an api that shows latest discussions from a forum..
the url that display the json output is like:
https://example.com/api/discussions?isApproved=true&exists=true&sort=-lastPostedAt
and this is the json output:
"links": {
"first": "http://localhost/flarum/public/api/discussions?isApproved=true\u0026exists=true\u0026sort=-lastPostedAt",
"next": "http://localhost/flarum/public/api/discussions?isApproved=true\u0026exists=true\u0026sort=-lastPostedAt\u0026page%5Boffset%5D=20"
},
"data": [
{
"type": "discussions",
"id": "46",
"attributes": {
"title": "footer",
"slug": "46-footer",
"commentCount": 1,
"participantCount": 1,
"createdAt": "2021-09-20T07:14:18+00:00",
"lastPostedAt": "2021-09-20T07:14:18+00:00",
"lastPostNumber": 1,
"canReply": true,
"canRename": true,
"canDelete": true,
"canHide": true,
"lastReadAt": "2021-09-20T07:14:20+00:00",
"lastReadPostNumber": 1,
"isApproved": true,
"canTag": true,
"subscription": null,
"isLocked": false,
"canLock": true
},
"relationships": { "user": { "data": { "type": "users", "id": "1" } }, "lastPostedUser": { "data": { "type": "users", "id": "1" } }, "tags": { "data": [{ "type": "tags", "id": "2" }] } }
},
{
"type": "discussions",
"id": "45",
"attributes": {
"title": "fhgfhfg",
"slug": "45-fhgfhfg",
"commentCount": 2,
"participantCount": 1,
"createdAt": "2021-09-19T16:07:37+00:00",
"lastPostedAt": "2021-09-19T23:04:00+00:00",
"lastPostNumber": 2,
"canReply": true,
"canRename": true,
"canDelete": true,
"canHide": true,
"lastReadAt": "2021-09-19T23:04:02+00:00",
"lastReadPostNumber": 2,
"isApproved": true,
"canTag": true,
"subscription": null,
"isLocked": false,
"canLock": true
},
"relationships": { "user": { "data": { "type": "users", "id": "1" } }, "lastPostedUser": { "data": { "type": "users", "id": "1" } }, "tags": { "data": [{ "type": "tags", "id": "2" }] } }
},
{
"type": "discussions",
"id": "39",
"attributes": {
"title": "Discussion",
"slug": "39-discussion",
"commentCount": 21,
"participantCount": 1,
"createdAt": "2021-05-22T11:06:43+00:00",
"lastPostedAt": "2021-09-04T12:49:32+00:00",
"lastPostNumber": 28,
"canReply": true,
"canRename": true,
"canDelete": true,
"canHide": true,
"lastReadAt": "2021-09-04T12:49:34+00:00",
"lastReadPostNumber": 28,
"isApproved": true,
"canTag": true,
"subscription": null,
"isLocked": false,
"canLock": true
},
"relationships": { "user": { "data": { "type": "users", "id": "1" } }, "lastPostedUser": { "data": { "type": "users", "id": "1" } }, "tags": { "data": [{ "type": "tags", "id": "1" }] } }
}
what i want to do is to have something like "related content" based on a discussion title. For example if i have this title "lets talk about cars", the json must shows all the discussions related to this title.
is this possible?
You can take the data from json and just filter the content inside
const filteredResults = yourJsonResponse.data.filter(item => item.attributes.title === 'lets talk about cars')
This won't be a good idea. as you're getting paginated list with limit(like per page 20/30). if you're using js you can use js filter for getting related content. But as i said. that filer will be done based on your current page data, not all data. it's better to use another api end for related content from large data..

upload video to vimeo with url

I am new in vimeo. I am just uploading the video to vimeo using link. The API gives me success and video is also uploaded to vimeo, but the video is not playing and says it is corrupted. Here is reference url:
https://github.com/websemantics/vimeo-upload
This is the code:
me.prototype.upload = function() {
var xhr = new XMLHttpRequest()
xhr.open(this.httpMethod, this.url, true)
xhr.setRequestHeader('Accept', 'application/vnd.vimeo.*+json;version=3.4')
xhr.setRequestHeader('Authorization', 'bearer xxxxxxxxxxxxxxx')
xhr.setRequestHeader('Content-Type', 'application/json')
xhr.onload = function(e) {
// get vimeo upload url, user (for available quote), ticket id and complete url
if (e.target.status < 400) {
var response = JSON.parse(e.target.responseText)
this.url = response.upload_link_secure
this.user = response.user
this.ticket_id = response.ticket_id
this.complete_url = defaults.api_url + response.complete_uri
// this.sendFile_()
} else {
this.onUploadError_(e)
}
}.bind(this)
xhr.onerror = this.onUploadError_.bind(this)
xhr.send(JSON.stringify({
"upload.approach" : "pull",
"upload.link" : "https://vimeo.com/6370469"
}))
}
The Response:
{
"uri": "/videos/267944773",
"name": "Untitled",
"description": null,
"link": "https://vimeo.com/267944773",
"duration": 0,
"width": 400,
"language": null,
"height": 300,
"embed": {
"uri": null,
"html": "<iframe src=\"https://player.vimeo.com/video/267944773?title=0&byline=0&portrait=0&badge=0&autopause=0&player_id=0&app_id=125909\" width=\"400\" height=\"300\" frameborder=\"0\" title=\"Untitled\" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>",
"buttons": {
"like": true,
"watchlater": true,
"share": true,
"embed": true,
"hd": false,
"fullscreen": true,
"scaling": true
},
"logos": {
"vimeo": true,
"custom": {
"active": false,
"link": null,
"sticky": false
}
},
"title": {
"name": "user",
"owner": "user",
"portrait": "user"
},
"playbar": true,
"volume": true,
"speed": false,
"color": "00adef"
},
"created_time": "2018-05-04T05:15:07+00:00",
"modified_time": "2018-05-04T05:15:07+00:00",
"release_time": "2018-05-04T05:15:07+00:00",
"content_rating": [
"unrated"
],
"license": null,
"privacy": {
"view": "anybody",
"embed": "public",
"download": true,
"add": true,
"comments": "anybody"
},
"pictures": {
"uri": null,
"active": false,
"type": "default",
"sizes": [
{
"width": 100,
"height": 75,
"link": "https://i.vimeocdn.com/video/default_100x75?r=pad",
"link_with_play_button": "https://i.vimeocdn.com/filter/overlay?src0=https%3A%2F%2Fi.vimeocdn.com%2Fvideo%2Fdefault_100x75&src1=http%3A%2F%2Ff.vimeocdn.com%2Fp%2Fimages%2Fcrawler_play.png"
},
{
"width": 200,
"height": 150,
"link": "https://i.vimeocdn.com/video/default_200x150?r=pad",
"link_with_play_button": "https://i.vimeocdn.com/filter/overlay?src0=https%3A%2F%2Fi.vimeocdn.com%2Fvideo%2Fdefault_200x150&src1=http%3A%2F%2Ff.vimeocdn.com%2Fp%2Fimages%2Fcrawler_play.png"
},
{
"width": 295,
"height": 166,
"link": "https://i.vimeocdn.com/video/default_295x166?r=pad",
"link_with_play_button": "https://i.vimeocdn.com/filter/overlay?src0=https%3A%2F%2Fi.vimeocdn.com%2Fvideo%2Fdefault_295x166&src1=http%3A%2F%2Ff.vimeocdn.com%2Fp%2Fimages%2Fcrawler_play.png"
},
{
"width": 640,
"height": 480,
"link": "https://i.vimeocdn.com/video/default_640x480?r=pad",
"link_with_play_button": "https://i.vimeocdn.com/filter/overlay?src0=https%3A%2F%2Fi.vimeocdn.com%2Fvideo%2Fdefault_640x480&src1=http%3A%2F%2Ff.vimeocdn.com%2Fp%2Fimages%2Fcrawler_play.png"
},
{
"width": 960,
"height": 720,
"link": "https://i.vimeocdn.com/video/default_960x720?r=pad",
"link_with_play_button": "https://i.vimeocdn.com/filter/overlay?src0=https%3A%2F%2Fi.vimeocdn.com%2Fvideo%2Fdefault_960x720&src1=http%3A%2F%2Ff.vimeocdn.com%2Fp%2Fimages%2Fcrawler_play.png"
},
{
"width": 1280,
"height": 960,
"link": "https://i.vimeocdn.com/video/default_1280x960?r=pad",
"link_with_play_button": "https://i.vimeocdn.com/filter/overlay?src0=https%3A%2F%2Fi.vimeocdn.com%2Fvideo%2Fdefault_1280x960&src1=http%3A%2F%2Ff.vimeocdn.com%2Fp%2Fimages%2Fcrawler_play.png"
},
{
"width": 1920,
"height": 1440,
"link": "https://i.vimeocdn.com/video/default_1920x1440?r=pad",
"link_with_play_button": "https://i.vimeocdn.com/filter/overlay?src0=https%3A%2F%2Fi.vimeocdn.com%2Fvideo%2Fdefault_1920x1440&src1=http%3A%2F%2Ff.vimeocdn.com%2Fp%2Fimages%2Fcrawler_play.png"
}
],
"resource_key": "7a491d0e8cad256a8ac2fd6d207e647c1b034bad"
},
"tags": [],
"stats": {
"plays": 0
},
"categories": [],
"metadata": {
"connections": {
"comments": {
"uri": "/videos/267944773/comments",
"options": [
"GET",
"POST"
],
"total": 0
},
"credits": {
"uri": "/videos/267944773/credits",
"options": [
"GET",
"POST"
],
"total": 1
},
"likes": {
"uri": "/videos/267944773/likes",
"options": [
"GET"
],
"total": 0
},
"pictures": {
"uri": "/videos/267944773/pictures",
"options": [
"GET",
"POST"
],
"total": 0
},
"texttracks": {
"uri": "/videos/267944773/texttracks",
"options": [
"GET",
"POST"
],
"total": 0
},
"related": null,
"recommendations": {
"uri": "/videos/267944773/recommendations",
"options": [
"GET"
]
}
},
"interactions": {
"watchlater": {
"uri": "/users/84634686/watchlater/267944773",
"options": [
"GET",
"PUT",
"DELETE"
],
"added": false,
"added_time": null
},
"report": {
"uri": "/videos/267944773/report",
"options": [
"POST"
],
"reason": [
"pornographic",
"harassment",
"advertisement",
"ripoff",
"incorrect rating",
"spam"
]
}
}
},
"user": {
"uri": "/users/84634686",
"name": "Lovey Singh",
"link": "https://vimeo.com/user84634686",
"location": null,
"bio": null,
"created_time": "2018-05-02T16:27:31+00:00",
"account": "basic",
"pictures": {
"uri": "/users/84634686/pictures/25155707",
"active": true,
"type": "custom",
"sizes": [
{
"width": 30,
"height": 30,
"link": "https://i.vimeocdn.com/portrait/25155707_30x30"
},
{
"width": 75,
"height": 75,
"link": "https://i.vimeocdn.com/portrait/25155707_75x75"
},
{
"width": 100,
"height": 100,
"link": "https://i.vimeocdn.com/portrait/25155707_100x100"
},
{
"width": 300,
"height": 300,
"link": "https://i.vimeocdn.com/portrait/25155707_300x300"
},
{
"width": 72,
"height": 72,
"link": "https://i.vimeocdn.com/portrait/25155707_72x72"
},
{
"width": 144,
"height": 144,
"link": "https://i.vimeocdn.com/portrait/25155707_144x144"
},
{
"width": 216,
"height": 216,
"link": "https://i.vimeocdn.com/portrait/25155707_216x216"
},
{
"width": 288,
"height": 288,
"link": "https://i.vimeocdn.com/portrait/25155707_288x288"
},
{
"width": 360,
"height": 360,
"link": "https://i.vimeocdn.com/portrait/25155707_360x360"
}
],
"resource_key": "7268675b46b5f07155d35ffaf0cfc98ae4d3a38b"
},
"websites": [],
"metadata": {
"connections": {
"albums": {
"uri": "/users/84634686/albums",
"options": [
"GET"
],
"total": 0
},
"appearances": {
"uri": "/users/84634686/appearances",
"options": [
"GET"
],
"total": 0
},
"categories": {
"uri": "/users/84634686/categories",
"options": [
"GET"
],
"total": 0
},
"channels": {
"uri": "/users/84634686/channels",
"options": [
"GET"
],
"total": 0
},
"feed": {
"uri": "/users/84634686/feed",
"options": [
"GET"
]
},
"followers": {
"uri": "/users/84634686/followers",
"options": [
"GET"
],
"total": 0
},
"following": {
"uri": "/users/84634686/following",
"options": [
"GET"
],
"total": 0
},
"groups": {
"uri": "/users/84634686/groups",
"options": [
"GET"
],
"total": 0
},
"likes": {
"uri": "/users/84634686/likes",
"options": [
"GET"
],
"total": 0
},
"moderated_channels": {
"uri": "/users/84634686/channels?filter=moderated",
"options": [
"GET"
],
"total": 0
},
"portfolios": {
"uri": "/users/84634686/portfolios",
"options": [
"GET"
],
"total": 0
},
"videos": {
"uri": "/users/84634686/videos",
"options": [
"GET"
],
"total": 1
},
"watchlater": {
"uri": "/users/84634686/watchlater",
"options": [
"GET"
],
"total": 0
},
"shared": {
"uri": "/users/84634686/shared/videos",
"options": [
"GET"
],
"total": 0
},
"pictures": {
"uri": "/users/84634686/pictures",
"options": [
"GET",
"POST"
],
"total": 1
},
"watched_videos": {
"uri": "/me/watched/videos",
"options": [
"GET"
],
"total": 0
},
"block": {
"uri": "/me/block",
"options": [
"GET"
],
"total": 0
}
}
},
"preferences": {
"videos": {
"privacy": {
"view": "anybody",
"comments": "anybody",
"embed": "public",
"download": true,
"add": true
}
}
},
"content_filter": [
"language",
"drugs",
"violence",
"nudity",
"safe",
"unrated"
],
"upload_quota": {
"space": {
"free": 524288000,
"max": 524288000,
"used": 0,
"showing": "periodic"
},
"periodic": {
"free": 524288000,
"max": 524288000,
"used": 0,
"reset_date": "2018-05-06T01:15:08-04:00"
},
"lifetime": {
"free": 5368709120,
"max": 5368709120,
"used": 0
}
},
"resource_key": "b03345ba2b5759492fad56d5a297636905a40336"
},
"review_page": null,
"last_user_action_event_date": null,
"app": {
"name": "golfApi",
"uri": "/apps/125909"
},
"status": "uploading",
"resource_key": "c521dbdfa3c0ffa20a963a760a4895bd4f174e48",
"upload": {
"status": "in_progress",
"upload_link": "https://1512435765.cloud.vimeo.com/upload?ticket_id=147907192&video_file_id=993214879&signature=9078eeb13ddbce78ea210f50f8a58237&v6=1&redirect_url=https%3A%2F%2Fvimeo.com%2Fupload%2Fapi%3Fvideo_file_id%3D993214879%26app_id%3D125909%26ticket_id%3D147907192%26signature%3D2f9faa44050984f217c818e80ccbcb66619fd917",
"form": "<form method=\"POST\" action=\"https://1512435765.cloud.vimeo.com/upload?ticket_id=147907192&video_file_id=993214879&signature=9078eeb13ddbce78ea210f50f8a58237&v6=1&redirect_url=https%3A%2F%2Fvimeo.com%2Fupload%2Fapi%3Fvideo_file_id%3D993214879%26app_id%3D125909%26ticket_id%3D147907192%26signature%3D2f9faa44050984f217c818e80ccbcb66619fd917\" enctype=\"multipart/form-data\">\n<label for=\"file\">File:</label>\n<input type=\"file\" name=\"file_data\" id=\"file\"><br>\n<input type=\"submit\" name=\"submit\" value=\"Submit\">\n</form>",
"complete_uri": null,
"approach": "post",
"size": null,
"redirect_url": null,
"link": null
},
"transcode": {
"status": "in_progress"
}
}
Please help me to sort out this problem.
The upload.link value you provide must be a direct link to a video file resource, not a web page.
For example, you provided:
"upload.link":"https://vimeo.com/6370469"
You'll want to use a direct link to a video file like this:
"upload.link":"http://download.blender.org/peach/bigbuckbunny_movies/big_buck_bunny_480p_surround-fix.avi"
(this is a link to an SD version of the open source film Big Buck Bunny, commonly used for testing)
Vimeo API pull upload documentation is found here: https://developer.vimeo.com/api/upload/videos#using-the-pull-approach

mongodb find query is not working

I have a collection facialAnalysisConfiguration
the data in the collection is as shown below
{
"details": {
"date": ISODate("2018-04-03T11:54:53.916+0000"),
"statusText": "OK",
"config": {
"headers": {
"Content-Type": "application/json;charset=utf-8",
"Accept": "application/json, text/plain, */*"
},
"data": {
"image": ""
},
"url": "/storeIncommingImages",
"jsonpCallbackParam": "callback",
"transformResponse": [
null
],
"transformRequest": [
null
],
"method": "POST"
},
"status": NumberInt(200),
"data": {
"FaceModelVersion": "2.0",
"OrientationCorrection": "ROTATE_0",
"FaceRecords": [{
"FaceDetail": {
"Confidence": 99.9393310546875,
"Quality": {
"Sharpness": 99.80813598632812,
"Brightness": 12.500774383544922
},
"Pose": {
"Pitch": -5.199888229370117,
"Yaw": -3.2905712127685547,
"Roll": 7.3970136642456055
},
"Emotions": [{
"Confidence": 44.84807205200195,
"Type": "CONFUSED"
},
{
"Confidence": 17.345977783203125,
"Type": "CALM"
},
{
"Confidence": 6.819361686706543,
"Type": "SURPRISED"
}
],
"MouthOpen": {
"Confidence": 99.90953826904297,
"Value": false
},
"EyesOpen": {
"Confidence": 99.79545593261719,
"Value": true
},
"Mustache": {
"Confidence": 99.68254852294922,
"Value": false
},
"Beard": {
"Confidence": 95.8907470703125,
"Value": false
},
"Gender": {
"Confidence": 99.9259262084961,
"Value": "Male"
},
"Sunglasses": {
"Confidence": 99.36517333984375,
"Value": false
},
"Eyeglasses": {
"Confidence": 99.82603454589844,
"Value": true
},
"Smile": {
"Confidence": 50.894676208496094,
"Value": false
},
"AgeRange": {
"High": NumberInt(15),
"Low": NumberInt(10)
},
"BoundingBox": {
"Top": 0.4294871687889099,
"Left": 0.29567307233810425,
"Height": 0.39743590354919434,
"Width": 0.30048078298568726
}
},
"Face": {
"Confidence": 99.9393310546875,
"ExternalImageId": "belgium_medium_gender",
"ImageId": "65e5b4f0-f803-5592-9c7c-95d3b983290b",
"BoundingBox": {
"Top": 0.4294871687889099,
"Left": 0.29567307233810425,
"Height": 0.39743590354919434,
"Width": 0.30048078298568726
},
"FaceId": "a875fb3b-4257-4cf0-951b-3d4892aabe41"
}
}]
}
},
"__v": NumberInt(0)
}
how to get all the records where the Emotions.type value is "CONFUSED"
please note the object navigation is as shown below details.data.FaceRecords[0].FaceDetail.Confidence
Tried writing few quires using aggregation but unable to find please suggest a way to approach it
I see conflicts in your description. You have mentioned that you want to get all the records where the Emotions.type value is "CONFUSED" but later have specified a object navigation (FaceDetail.Confidence).
Regardless, the below query should return all the matching records whose Emotions.Type is CONFUSED.
db.facialAnalysisConfiguration.find( { "details.data.FaceRecords.FaceDetail.Emotions.Type": "CONFUSED" }

How do I add a data object to a JSON object?

I want to add the data [] of list 2 to list 1 as children. The desired output is list 3. But with my code I get empty string as values for children. The api call in _getJsonObject(id,user) brings list 2.
The code I have looks as follows:
var strList = function (){
var listItems= "";
$.ajax({
url: 'http://localhost:8088/api/v1/ui/performance/custom_link_groups?',
dataType: 'json',
async: false,
success: function(data){
for (var i = 0; i < data.data.length; i++){
data.data[i].children = _getJsonObject(data.data[i].$ID,data.data[i].$userId);
}
listItems = data;
}
});
return listItems;
}();
function _getJsonObject(id,user){
var rdata = "";
$.ajax({
url: 'http://localhost:8088/api/v1/ui/performance/custom_links?group='+id+'&user='+user,
dataType: 'json',
async: false,
success: function(data){
rdata = data.data;
}
});
return rdata;
}
List 1
{
"response_code": 200,
"error_code": "",
"error_message": "",
"status": "SUCCESS",
"row_count": 5,
"data": [
{
"ID": "84",
"groupLabel": "Interface Util",
"isPrivate": "0",
"userId": "user1"
},
{
"ID": "85",
"groupLabel": "Hendrick Test Mweb",
"isPrivate": "0",
"userId": "user2"
},
{
"ID": "86",
"groupLabel": "test",
"isPrivate": "0",
"userId": "user4"
},
{
"ID": "87",
"groupLabel": "Interface Util",
"isPrivate": null,
"userId": "user3"
},
{
"ID": "88",
"groupLabel": "testing",
"isPrivate": "0",
"userId": "user5"
}
],
"meta": ""
}
List 2
{
"response_code": 200,
"error_code": "",
"error_message": "",
"status": "SUCCESS",
"row_count": 2,
"data": [
{
"ID": "53",
"attributeId": "2194242",
"groupId": "85",
"isSummary": null,
"label": "DEV-SUPPORT-PC, DEV-SUPPORT-PC : Uptime",
"rrdGraphGroup": null
},
{
"ID": "54",
"attributeId": "2255447||2255453",
"groupId": "85",
"isSummary": null,
"label": "DEV-SUPPORT-PC, Intel(R)%2082578DC%20Gigabit%20Network%20Connection%20 : Utilization",
"rrdGraphGroup": "Utilization"
}
],
"meta": ""
}
List 3
{
"response_code": 200,
"error_code": "",
"error_message": "",
"status": "SUCCESS",
"row_count": 5,
"data": [
{
"ID": "84",
"groupLabel": "Interface Util",
"isPrivate": "0",
"userId": "user1",
"children": ""
},
{
"ID": "85",
"groupLabel": "Hendrick Test Mweb",
"isPrivate": "0",
"userId": "user2",
"chlidren": [
{
"ID": "53",
"attributeId": "2194242",
"groupId": "85",
"isSummary": null,
"label": "DEV-SUPPORT-PC, DEV-SUPPORT-PC : Uptime",
"rrdGraphGroup": null
},
{
"ID": "54",
"attributeId": "2255447||2255453",
"groupId": "85",
"isSummary": null,
"label": "DEV-SUPPORT-PC, Intel(R)%2082578DC%20Gigabit%20Network%20Connection%20 : Utilization",
"rrdGraphGroup": "Utilization"
}
]
},
{
"ID": "86",
"groupLabel": "test",
"isPrivate": "0",
"userId": "user4",
"children": ""
},
{
"ID": "87",
"groupLabel": "Interface Util",
"isPrivate": null,
"userId": "user3",
"children": ""
},
{
"ID": "88",
"groupLabel": "testing",
"isPrivate": "0",
"userId": "user5",
"children": ""
}
],
"meta": ""
}
var strList = function (callback){
var listItems= "";
$.ajax({
url: 'http://localhost:8088/api/v1/ui/performance/custom_link_groups?',
dataType: 'json',
async: false,
success: function(data){
for (var i = 0; i < data.data.length; i++){
_getJsonObject(data.data[i].$ID,data.data[i].$userId,
function(data)
{
data.data[i].children = data;
});
}
callback(data);
}
});
return listItems;
}();
function _getJsonObject(id,user, callback){
var rdata = "";
$.ajax({
url: 'http://localhost:8088/api/v1/ui/performance/custom_links?group='+id+'&user='+user,
dataType: 'json',
async: false,
success: function(data){
callback(data.data);
}
});
return rdata;
}

Categories