How to match key while pushing value into array in javascript - javascript

I want to push a value after matching id value.
I have comments JSON which has property : reply
[{
"id": "1",
"root_id": "1",
"target_id": "12",
"text": "Hello World!",
"comment_posted_by": "John",
"comment_posted_by_image": "/../../assets/images/no-user.png",
"comment_time": "2 mins ago",
"reply": [{
"id": "123",
"root_id": "1",
"target_id": "222",
"text": "Nice!"
},
{
"id": "124",
"root_id": "1",
"target_id": "222",
"text": "Good!"
}
]
},
{
"id": "2",
"root_id": "2",
"target_id": "12",
"text": "Hello RG!",
"comment_posted_by": "John",
"comment_posted_by_image": "/../../assets/images/no-user.png",
"comment_time": "2 mins ago",
"reply": [{
"id": "123",
"root_id": "1",
"target_id": "222",
"text": "Hey john how are you?"
},
{
"id": "124",
"root_id": "1",
"target_id": "222",
"text": "Hi john!"
}
]
}, {
"id": "3",
"root_id": "3",
"target_id": "12",
"text": "Thanks.",
"comment_posted_by": "John",
"comment_posted_by_image": "/../../assets/images/no-user.png",
"comment_time": "2 mins ago"
}, {
"id": "4",
"root_id": "4",
"target_id": "12",
"text": "Great.",
"comment_posted_by": "John",
"comment_posted_by_image": "/../../assets/images/no-user.png",
"comment_time": "2 mins ago"
},
{
"id": "5",
"root_id": "5",
"target_id": "12",
"text": "Welcome.",
"comment_posted_by": "John",
"comment_posted_by_image": "/../../assets/images/no-user.png",
"comment_time": "2 mins ago"
}
]
Comments and their Reply
I want to push a reply on by using below HTML code:
HTML
<div [attr.commentId]="commentData.id" class="addReplyContainer replyTextAreaContainer" style="display: none" >
<textarea (keyup.enter)="addReply($event,commenData.root_id)" [(ngModel)]="reply" style="width:100%" class="replyText commentText addReplyTextarea form-control"></textarea>
</div>
and want to push newly made reply json into array mentioned above:
var reply =
{
"id": "125",
"root_id":1,
"target_id":"222",
"text":"Great!"
}
Is there a way to do this using $.each?
I am trying below method but it is giving me error:
addReply(event, root_id)
{
let commentDataa = this.commentsData;
let replyy = this.reply;
jQuery.each(this.commentsData, function (index, value) {
if(value.root_id == root_id)
{
commentDataa.reply.push({
root_id:root_id,
target_id: "12",
text: replyy,
});
}
})
}
Error: ERROR TypeError: Cannot read property 'push' of undefined
Any guidance would be appreciated.
Thanks in ADVANCE.


You need to access the index of the commentDataa array so that you can push reply in that particular object of commentDataa[index] object.
addReply(event, root_id);
{
let commentDataa = this.commentsData;
let replyy = this.reply;
jQuery.each(this.commentsData, function (index, value) {
if (value.root_id == root_id) {
commentDataa[index].reply.push({
root_id: root_id,
target_id: '12',
text: replyy
});
}
});
}

Related

filter an API data with current date in javascript

this is example of data from my API look like.
const data = [{
"id": "1",
"name": "Lesley",
"creationDate": "2019-11-21 20:33:49.04",
},
{
"id": "2",
"name": "Claude",
"creationDate": "2019-11-21 20:33:09.397",
},
{
"id": "3",
"name": "Lesley",
"creationDate": "2019-11-20 20:31:46.357",
{
"id": "4",
"name": "Yin Sun Shin",
"creationDate": "2019-11-20 23:13:40.41",
},
{
"id": "5",
"name": "Claude",
"creationDate": "2019-11-21 23:13:30.18",
},
{
"id": "6",
"name": "Moskov",
"creationDate": "2019-11-20 23:10:22.863",
},
{
"id": "7",
"name": "Lesley",
"creationDate": "2019-11-19 01:15:26.457",
},
{
"id": "8",
"name": "Yin Sun Shin",
"creationDate": "2019-11-19 19:39:32.233",
},
{
"id": "9",
"name": "Claude",
"creationDate": "2019-11-18 19:38:54.117",
}]
i have a list of data that need to display all information in vue-ant-design list. but there is too much of data that make the system lagging. i'm intended filter this data before being displayed. i've tried some other javascript function to display the latest date data but not succeed. is there any javascript reference that i can refer or any sharing that i can refer for how to filter this API data with the latest date in the creationDate? i've no more idea on how to filter this data.

The best will be to get the data from the API ready to show..
But, with JavaScript in the frontend you can do:
Sort by creationDate DESC
Filter elements with creationDate.substring(0, 10) equal to first element's creationDate.substring(0, 10) in the sorted array
Code:
const data = [{ "id": "1", "name": "Lesley", "creationDate": "2019-11-21 20:33:49.04", }, { "id": "2", "name": "Claude", "creationDate": "2019-11-21 20:33:09.397", }, { "id": "3", "name": "Lesley", "creationDate": "2019-11-20 20:31:46.357", }, { "id": "4", "name": "Yin Sun Shin", "creationDate": "2019-11-20 23:13:40.41", }, { "id": "5", "name": "Claude", "creationDate": "2019-11-21 23:13:30.18", }, { "id": "6", "name": "Moskov", "creationDate": "2019-11-20 23:10:22.863", }, { "id": "7", "name": "Lesley", "creationDate": "2019-11-19 01:15:26.457", }, { "id": "8", "name": "Yin Sun Shin", "creationDate": "2019-11-19 19:39:32.233", }, { "id": "9", "name": "Claude", "creationDate": "2019-11-18 19:38:54.117", }]
const result = data
.sort((a, b) => new Date(b.creationDate) - new Date(a.creationDate))
.filter((a, _, arr) => a.creationDate.substring(0, 10) === arr[0].creationDate.substring(0, 10))
console.log(result)

Cyclic Tree with new ParentId and ChildId

I have a hierarchy tree JSON with multiple level of nesting. When i am trying to loop through the JSON for displaying tree structure in UI. I am ending up with cyclic redundancy since parent ID is same at different level. I need to add unique identifiers for parentID and ID, so in recursive call it does not end up in infinite loop.
Sample JSON :
[
{
"id": "12",
"text": "Man"
},
{
"id": "6",
"parentId": "12",
"text": "Boy"
},
{
"id": "9",
"parentId": "6",
"text": "Boy-Boy"
},
{
"id": "13",
"parentId": "9",
"text": "Boy-Boy-Boy"
},
{
"id": "7",
"parentId": "12",
"text": "Other"
},
{
"id": "6",
"parentId": "7",
"text": "Boy"
},
{
"id": "9",
"parentId": "6",
"text": "Boy-Boy"
},
{
"id": "13",
"parentId": "9",
"text": "Boy-Boy-Boy"
}
I have tried by adding depth to each level but not able to maintain the ParentId and Id relationship.
var depthArray = []
function addDepth(arr, depth = 0) {
arr.forEach(obj => {
obj.id = obj.id + '-' + depth;
if(obj.children !== undefined) {
addDepth(obj.children, depth + 1)
}})
return arr;
}
[
{
"id": "12",
"text": "Man"
},
{
"id": "6",
"parentId": "12",
"text": "Boy"
},
{
"id": "9",
"parentId": "6",
"text": "Boy-Boy"
},
{
"id": "13",
"parentId": "9",
"text": "Boy-Boy-Boy"
},
{
"id": "7",
"parentId": "12",
"text": "Other"
},
{
"id": "6-1",
"parentId": "7",
"text": "Boy"
},
{
"id": "9-1",
"parentId": "6-1",
"text": "Boy-Boy"
},
{
"id": "13-1",
"parentId": "9-1",
"text": "Boy-Boy-Boy"
}
]

Your recursion does not work, what about this ?
But not sure how to rename IDs:
'use strict';
function addDepth(arr, id, depth) {
if(depth === undefined) depth = 0;
if(id !== undefined)
arr.forEach(obj => {
if(id == obj.parentId) {
if(depth) obj.parentId += '-' + depth;
addDepth(arr, obj.id, depth + 1)
}
})
else arr.forEach(obj => { addDepth(arr, obj.id, depth); });
return arr;
}
console.log(addDepth(
[
{
"id": "12",
"text": "Man"
},
{
"id": "6",
"parentId": "12",
"text": "Boy"
},
{
"id": "9",
"parentId": "6",
"text": "Boy-Boy"
},
{
"id": "13",
"parentId": "9",
"text": "Boy-Boy-Boy"
},
{
"id": "7",
"parentId": "12",
"text": "Other"
},
{
"id": "6",
"parentId": "7",
"text": "Boy"
},
{
"id": "9",
"parentId": "6",
"text": "Boy-Boy"
},
{
"id": "13",
"parentId": "9",
"text": "Boy-Boy-Boy"
}
]
));
Hard to guess how structure may look like, but made a supposed output by hand and then similar code - looking up only (not sure how to distinguish same records with parentId difference):
12 Man
12 6 Man Boy
12 6 9 Man Boy Boy-Boy
12 6 9 13 Man Boy Boy-Boy Boy-Boy-Boy
12 7 Man Other
12 7 Man Other Boy
12 7 6 9 Man Other Boy Boy-Boy
12 7 6 9 13 Man Other Boy Boy-Boy Boy-Boy-Boy
var data = GetData();
var arr = [data[0].text], parent;
for(var i=0;i<data.length;i++) {
if(parent = data[i].parentId) {
arr.push(data[i].text); // we have parentId, so iterate back
for(var j=i;j >= 0;j--) {
if(data[j].id == parent) {
arr.push(data[j].text); // & colect text properties
if(data[j].parentId) {
parent = data[j].parentId;
j = i;
}
}
}
}
console.log(arr.reverse().join(" -> "));
arr = [];
}
function GetData() { return [
{
"id": "12",
"text": "Man"
},
{
"id": "6",
"parentId": "12",
"text": "Boy"
},
{
"id": "9",
"parentId": "6",
"text": "Boy-Boy"
},
{
"id": "13",
"parentId": "9",
"text": "Boy-Boy-Boy"
},
{
"id": "7",
"parentId": "12",
"text": "Other"
},
{
"id": "6",
"parentId": "7",
"text": "Boy"
},
{
"id": "9",
"parentId": "6",
"text": "Boy-Boy"
},
{
"id": "13",
"parentId": "9",
"text": "Boy-Boy-Boy"
}
];
}

how to run ng-repeat or forEach of angular on complex json

I have a situation where I'm getting list of complex JSON data(nested type).I'm new to AngularJS, not getting solution to run ng-repeat or forEach over that.
My returned data is like below.
[{
"studPersonalDetails": {
"id": 0,
"name": "Digvijay",
"middleName": "",
"lastName": "Singh",
"fatherName": "abac",
"motherName": "abc",
"dob": "5/7/1990 12:00:00 AM"
},
"clients": {
"clientID": 1,
"clientName": null,
"clientDescriptions": null
},
"studentAddress": {
"address1": "12",
"address2": "12",
"city": "21",
"state": "212",
"pin": 2
},
"courseDetails": {
"courseID": 12,
"courseName": "12",
"courseDetail": null
},
"studentContacts": {
"email": "12",
"alternatePhone": "12",
"phone": "qw"
}
}, {
"studPersonalDetails": {
"id": 0,
"name": "Anil",
"middleName": "kumar",
"lastName": "Sharma",
"fatherName": "bac",
"motherName": "bac",
"dob": "2/11/1989 12:00:00 AM"
},
"clients": {
"clientID": 1,
"clientName": null,
"clientDescriptions": null
},
"studentAddress": {
"address1": "21",
"address2": "21",
"city": "5456",
"state": "8",
"pin": 7
},
"courseDetails": {
"courseID": 58,
"courseName": "58",
"courseDetail": null
},
"studentContacts": {
"email": "12",
"alternatePhone": "12",
"phone": "abc"
}
}]
This is the response returned by API.
Any help would be appreciated!Thanks!!

You can try something like this:
JSFiddle.
<div ng-repeat="currentRow in data">
<span>{{currentRow.studPersonalDetails.name}}</span>
<span>{{currentRow.studPersonalDetails.lastName}}</span>
</div>

$scope.arr = [{
"studPersonalDetails": {
"id": 0,
"name": "Digvijay",
"middleName": "",
"lastName": "Singh",
"fatherName": "Shyam Bahadur Singh",
"motherName": "ramawati Devi",
"dob": "5/7/1990 12:00:00 AM"
},
"clients": {
"clientID": 1,
"clientName": null,
"clientDescriptions": null
},
"studentAddress": {
"address1": "12",
"address2": "12",
"city": "21",
"state": "212",
"pin": 2
},
"courseDetails": {
"courseID": 12,
"courseName": "12",
"courseDetail": null
},
"studentContacts": {
"email": "12",
"alternatePhone": "12",
"phone": "qw"
}
}, {
"studPersonalDetails": {
"id": 0,
"name": "Anil",
"middleName": "kumar",
"lastName": "Sharma",
"fatherName": "bac",
"motherName": "bac",
"dob": "2/11/1989 12:00:00 AM"
},
"clients": {
"clientID": 1,
"clientName": null,
"clientDescriptions": null
},
"studentAddress": {
"address1": "21",
"address2": "21",
"city": "5456",
"state": "8",
"pin": 7
},
"courseDetails": {
"courseID": 58,
"courseName": "58",
"courseDetail": null
},
"studentContacts": {
"email": "12",
"alternatePhone": "12",
"phone": "abc"
}
}]
Using angular.forEach you can do it like this.
angular.forEach($scope.arr,function(value,key){
console.log(value.studPersonalDetails.lastName);
})
Using ng-repeat,you can do it like this.
<tr ng-repeat="oneArr in arr">
<td> {{oneArr.studPersonalDetails.name}}</td>
</tr>
Here is the plunker

You can see an angular ngRepeat example with your data here
First, create a controller with your data:
var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
$scope.datalist = [
{
"studPersonalDetails":{
"id":0,
"name":"Digvijay",
"middleName":"",
"lastName":"Singh",
"fatherName":"Shyam Bahadur Singh",
"motherName":"ramawati Devi",
"dob":"5/7/1990 12:00:00 AM"
},
"clients":{
"clientID":1,
"clientName":null,
"clientDescriptions":null
},
"studentAddress":{
"address1":"12",
"address2":"12",
"city":"21",
"state":"212",
"pin":2
},
"courseDetails":{
"courseID":12,
"courseName":"12",
"courseDetail":null
},
"studentContacts":{
"email":"12",
"alternatePhone":"12",
"phone":"qw"
}
},
{
"studPersonalDetails":{
"id":0,
"name":"Anil",
"middleName":"kumar",
"lastName":"Sharma",
"fatherName":"bac",
"motherName":"bac",
"dob":"2/11/1989 12:00:00 AM"
},
"clients":{
"clientID":1,
"clientName":null,
"clientDescriptions":null
},
"studentAddress":{
"address1":"21",
"address2":"21",
"city":"5456",
"state":"8",
"pin":7
},
"courseDetails":{
"courseID":58,
"courseName":"58",
"courseDetail":null
},
"studentContacts":{
"email":"12",
"alternatePhone":"12",
"phone":"abc"
}
}
];
}
Then attach this controller to your view and use the ngRepeat to extract each top-level object from dataList array (during the itaration the current object has alias data)
Inside the repeat statement you can display requested values accessing the data object using dot notation:
<div ng-controller="MyCtrl">
<div class="row" ng-repeat="data in datalist">
<p><span>Name</span> {{ data.studPersonalDetails.name }}</p>
<p><span>CourseID</span> {{ data.courseDetails.courseID }}</p>
</div>
</div>

How can I read specific property from a JSON string in JavaScript?

How can I read agent_code from this string with JavaScript? And please explain me the logic.
JSON (one-line):
[{"name":"NYC","zone_id":"1","totalagents":"40","agents":[{"id":"1","agent_code":"====="},{"id":"2","agent_code":"====="},{"id":"3","agent_code":"Christian"},{"id":"4","agent_code":"Tom"},{"id":"5","agent_code":"Dave Damsky"},{"id":"6","agent_code":"====="},{"id":"7","agent_code":"Andrew"},{"id":"8","agent_code":"Paolo"},{"id":"9","agent_code":"Josh"},{"id":"10","agent_code":"Shipster Van"},{"id":"11","agent_code":"====="},{"id":"16","agent_code":"Christian2"},{"id":"20","agent_code":"Nathan"},{"id":"21","agent_code":"Aaron"},{"id":"22","agent_code":"Rob"},{"id":"23","agent_code":"Taylor"},{"id":"24","agent_code":"Drea"},{"id":"25","agent_code":"Mario "},{"id":"26","agent_code":"Julio"},{"id":"27","agent_code":"Abbas"},{"id":"28","agent_code":"Ahmed"},{"id":"29","agent_code":"David Damsky"},{"id":"30","agent_code":"Micheal"},{"id":"31","agent_code":"Moe"},{"id":"32","agent_code":"Luis"},{"id":"33","agent_code":"Darin"},{"id":"37","agent_code":"Alan"},{"id":"39","agent_code":"Cristian Marte"},{"id":"40","agent_code":"Cody"},{"id":"41","agent_code":"David Pinto"},{"id":"42","agent_code":"Will "},{"id":"44","agent_code":"Evan"},{"id":"45","agent_code":"Santiago"},{"id":"46","agent_code":"John"},{"id":"47","agent_code":"Moubeen"},{"id":"49","agent_code":"Devin Armstrong"},{"id":"50","agent_code":"Marco Bell"},{"id":"51","agent_code":"Youness Benzaid"},{"id":"52","agent_code":"Amin Mechouche"},{"id":"53","agent_code":"Franco Herrera"}]}]
JSON (formatted):
[
{
"name": "NYC",
"zone_id": "1",
"totalagents": "40",
"agents": [
{
"id": "1",
"agent_code": "====="
},
{
"id": "2",
"agent_code": "====="
},
{
"id": "3",
"agent_code": "Christian"
},
{
"id": "4",
"agent_code": "Tom"
},
{
"id": "5",
"agent_code": "Dave Damsky"
},
{
"id": "6",
"agent_code": "====="
},
{
"id": "7",
"agent_code": "Andrew"
},
{
"id": "8",
"agent_code": "Paolo"
},
{
"id": "9",
"agent_code": "Josh"
},
{
"id": "10",
"agent_code": "Shipster Van"
},
{
"id": "11",
"agent_code": "====="
},
{
"id": "16",
"agent_code": "Christian2"
},
{
"id": "20",
"agent_code": "Nathan"
},
{
"id": "21",
"agent_code": "Aaron"
},
{
"id": "22",
"agent_code": "Rob"
},
{
"id": "23",
"agent_code": "Taylor"
},
{
"id": "24",
"agent_code": "Drea"
},
{
"id": "25",
"agent_code": "Mario "
},
{
"id": "26",
"agent_code": "Julio"
},
{
"id": "27",
"agent_code": "Abbas"
},
{
"id": "28",
"agent_code": "Ahmed"
},
{
"id": "29",
"agent_code": "David Damsky"
},
{
"id": "30",
"agent_code": "Micheal"
},
{
"id": "31",
"agent_code": "Moe"
},
{
"id": "32",
"agent_code": "Luis"
},
{
"id": "33",
"agent_code": "Darin"
},
{
"id": "37",
"agent_code": "Alan"
},
{
"id": "39",
"agent_code": "Cristian Marte"
},
{
"id": "40",
"agent_code": "Cody"
},
{
"id": "41",
"agent_code": "David Pinto"
},
{
"id": "42",
"agent_code": "Will "
},
{
"id": "44",
"agent_code": "Evan"
},
{
"id": "45",
"agent_code": "Santiago"
},
{
"id": "46",
"agent_code": "John"
},
{
"id": "47",
"agent_code": "Moubeen"
},
{
"id": "49",
"agent_code": "Devin Armstrong"
},
{
"id": "50",
"agent_code": "Marco Bell"
},
{
"id": "51",
"agent_code": "Youness Benzaid"
},
{
"id": "52",
"agent_code": "Amin Mechouche"
},
{
"id": "53",
"agent_code": "Franco Herrera"
}
]
}
]

Lets say your above is a json string
var jsonString = '[{"name":"NYC","zone_id":"1","totalagents":"40","agents":[{"id":"1","agent_code":"====="},{"id":"2","agent_code":"====="},{"id":"3","agent_code":"Christian"},{"id":"4","agent_code":"Tom"},{"id":"5","agent_code":"Dave Damsky"},{"id":"6","agent_code":"====="},{"id":"7","agent_code":"Andrew"},{"id":"8","agent_code":"Paolo"},{"id":"9","agent_code":"Josh"},{"id":"10","agent_code":"Shipster Van"},{"id":"11","agent_code":"====="},{"id":"16","agent_code":"Christian2"},{"id":"20","agent_code":"Nathan"},{"id":"21","agent_code":"Aaron"},{"id":"22","agent_code":"Rob"},{"id":"23","agent_code":"Taylor"},{"id":"24","agent_code":"Drea"},{"id":"25","agent_code":"Mario "},{"id":"26","agent_code":"Julio"},{"id":"27","agent_code":"Abbas"},{"id":"28","agent_code":"Ahmed"},{"id":"29","agent_code":"David Damsky"},{"id":"30","agent_code":"Micheal"},{"id":"31","agent_code":"Moe"},{"id":"32","agent_code":"Luis"},{"id":"33","agent_code":"Darin"},{"id":"37","agent_code":"Alan"},{"id":"39","agent_code":"Cristian Marte"},{"id":"40","agent_code":"Cody"},{"id":"41","agent_code":"David Pinto"},{"id":"42","agent_code":"Will "},{"id":"44","agent_code":"Evan"},{"id":"45","agent_code":"Santiago"},{"id":"46","agent_code":"John"},{"id":"47","agent_code":"Moubeen"},{"id":"49","agent_code":"Devin Armstrong"},{"id":"50","agent_code":"Marco Bell"},{"id":"51","agent_code":"Youness Benzaid"},{"id":"52","agent_code":"Amin Mechouche"},{"id":"53","agent_code":"Franco Herrera"}]}]';
var json = JSON.parse(jsonString); // parse string into json
Now as this json is an array with length 1, to get all agent code you will have to do something like this.
for (var i = 0; i <json[0].agents.length; i++) {
console.log(json[0].agents[i].agent_code);
}

http request and convert to json with comparision of json

I want to make a http request to a url lets say
http://test1.com/info this will give me xml
I want to convert
this xml from 1 to json lets say json 1
Now I make a rest request to url lets
say http://test2.com/myweb this returns a json lets say json 2
json 1
[
{
"id": "123",
"testname": "test123",
"name": "John Doe",
"active": true,
"type": "test6"
}
{
"id": "456",
"testname": "test564",
"name": "Ship Therasus",
"active": true,
"type": "test7"
}
.... some 100 entries
]
and json 2 some like below
[
{
"id": "123",
"country": "USA",
"state": "KA",
"age": 24,
"group": "g1"
}
{
"id": "456",
"country": "UK",
"state": "MA",
"age": 28,
"group": "G2"
}
...... 100 entries
]
Now Id is the constant thing between json1 and json2 I want to make a resultant json something like below lets call json3.I want to match the id and get country and state from json2 and append to json1
[
{
"id": "123",
"testname": "test123",
"name": "John Doe",
"active": true,
"type": "test6",
"country":"USA",
"state":"KA"
}
{
"id": "456",
"testname": "test564",
"name": "Ship Therasus",
"active": true,
"type": "test7",
"country":"UK",
"state":"MA"
}
]
Now wat i tried for 1 and 3 but for 2 dont know wat to do and to compare and combine I am not sure wat to do If any help will be greatful
function fun()
{
var data="hello";
$.post('http://localhost/ws/service.asmx/HelloWord',{},function(response)
{ data = response;
}).error(function(){
alert("Sorry could not proceed");
});
return data;
}

you can try this:
<script>
$(document).ready(function(){
var result=[];
var x=[{"id": "123","testname": "test123", "name": "John Doe","active": true,"type": "test6"},{"id": "456", "testname": "test564", "name": "Ship Therasus", "active": true,"type": "test7" }];
var y = [{ "id": "123", "country": "USA", "state": "KA", "age": 24,"group": "g1"},{ "id": "456", "country": "UK", "state": "MA", "age": 28, "group": "G2"}];
for (i in x){
for (j in y){
if(x[i].id == y[j].id){
result.push($.extend(x[i], y[j]));
}
}
}
console.log(result);
});
</script>

Categories