Continue add items from array until end loop - javascript

I have an object like this:
var Object = {
"id": "Siplus",
"name":"Siplus",
"icon":"forum"
},
{
"id": "Recent",
"name":"Recent Activities",
"icon": "restore"
},
{
"id": "jobList",
"name":"Job List",
"icon": "briefcase"
},
{
"id": "Favourites",
"name":"Favourites",
"icon": "star"
},
{
"id": "searchQuote",
"name":"Search Quotes",
"icon": "binoculars"
},
{
"id": "orderStatus",
"name":"Order Status",
"icon": "clock"
};
I have another array Like this
var array = [1,2,3];
I adding array values to object using this code:
for (var i = 0; i < object.length; i++) {
object[i].number = array[i];
}
I am getting result like this:
var Object = {
"id": "Siplus",
"name":"Siplus",
"icon":"forum",
"number":1
},
{
"id": "Recent",
"name":"Recent Activities",
"icon": "restore",
"number":2
},
{
"id": "jobList",
"name":"Job List",
"icon": "briefcase",
"number":3
},
{
"id": "Favourites",
"name":"Favourites",
"icon": "star",
"number":undefined
},
{
"id": "searchQuote",
"name":"Search Quotes",
"icon": "binoculars",
"number":undefined
},
{
"id": "orderStatus",
"name":"Order Status",
"icon": "clock",
"number":undefined
};
I wanted like this :
var Object = {
"id": "Siplus",
"name":"Siplus",
"icon":"forum",
"number":1
},
{
"id": "Recent",
"name":"Recent Activities",
"icon": "restore",
"number":2
},
{
"id": "jobList",
"name":"Job List",
"icon": "briefcase",
"number":3
},
{
"id": "Favourites",
"name":"Favourites",
"icon": "star",
"number":1
},
{
"id": "searchQuote",
"name":"Search Quotes",
"icon": "binoculars",
"number":2
},
{
"id": "orderStatus",
"name":"Order Status",
"icon": "clock",
"number":3
};
Is their any way to get repeat the number instead of getting "undefined"
Please help me for this

You could map your input objects by adding the right value from array thanks to the modulo calculus
var data = [{
"id": "Siplus",
"name":"Siplus",
"icon":"forum"
},
{
"id": "Recent",
"name":"Recent Activities",
"icon": "restore"
},
{
"id": "jobList",
"name":"Job List",
"icon": "briefcase"
},
{
"id": "Favourites",
"name":"Favourites",
"icon": "star"
},
{
"id": "searchQuote",
"name":"Search Quotes",
"icon": "binoculars"
},
{
"id": "orderStatus",
"name":"Order Status",
"icon": "clock"
}];
var array = [1,2,3];
res = data.map((x,i) => {
x.number = array[i % array.length]
return x;
})
console.log(res);

The size of array is 3 while that of object is more - a solution would be to use:
object[i].number = array[i % array.length];
See demo below:
var object=[{"id":"Siplus","name":"Siplus","icon":"forum"},{"id":"Recent","name":"Recent Activities","icon":"restore"},{"id":"jobList","name":"Job List","icon":"briefcase"},{"id":"Favourites","name":"Favourites","icon":"star"},{"id":"searchQuote","name":"Search Quotes","icon":"binoculars"},{"id":"orderStatus","name":"Order Status","icon":"clock"}]
var array = [1, 2, 3];
for (var i = 0; i < object.length; i++) {
object[i].number = array[i % array.length];
}
console.log(object);
.as-console-wrapper{top:0;max-height:100%!important;}

you could use an additional var.
for (var i = 0, j = 0; i < object.length; i++) {
j++
if(j > array.length){j=0}
object[i].number = array[j];
}

var arrLength = array.length;
for (var i = 0, j = 0; i < object.length; i++, j++) {
if (i >= arrLength ) {
j = 0;
}
object[i].number = array[j];
}

You could use a temporary value to point to the numbers array like this:
var temp = 0;
for (var i = 0; i < object.length; i++) {
object[i].number = array[temp];
if(temp == array.length)
temp = 0;
else
temp++;
}

Related

Sorting JSON alphabetically by first letter

I have a JSON like this:
[
{
"id": 1,
"slug": "abakan",
"name": "Абакан"
},
{
"id": 4,
"slug": "almetevsk",
"name": "Альметьевск"
},
{
"id": 10,
"slug": "astrahan",
"name": "Астрахань"
},
{
"id": 11,
"slug": "barnaul",
"name": "Барнаул"
},
...
]
And getting this by this method:
public function getCities()
{
$cities = City::mainCities()->get(['id', 'slug', 'name']);
return response()->json($cities);
}
How can i sort this list alphabetically and with their letters. For example:
"A": [
{
"id": 1,
"slug": "abakan",
"name": "Абакан"
},
{
"id": 4,
"slug": "almetevsk",
"name": "Альметьевск"
}
],
"B": [
{
"id": 11,
"slug": "barnaul",
"name": "Барнаул"
},
...
]
and so on...
I have Laravel on the backend and VueJS on front.
My solution:
var cities = [
{ id: 1, slug: "abakan", name: "Абакан" },
{ id: 4, slug: "almetevsk", name: "Альметьевск" },
{ id: 11, slug: "barnaul", name: "Барнаул" },
{ id: 10, slug: "astrahan", name: "Астрахань" }
];
cities.sort(function(a, b) {
return a.slug[0].localeCompare(b.slug[0]);
});
var newCities = {};
for (var i = 0; i < cities.length; i++) {
var c = cities[i].slug[0].toUpperCase();
if (newCities[c] && newCities[c].length >= 0)
newCities[c].push(cities[i]);
else {
newCities[c] = [];
newCities[c].push(cities[i]);
}
}
console.log(newCities);
This works for me:
var items = [
{
"id": 11,
"slug": "barnaul",
"name": "Барнаул"
},
{
"id": 1,
"slug": "abakan",
"name": "Абакан"
},
{
"id": 4,
"slug": "almetevsk",
"name": "Альметьевск"
},
{
"id": 10,
"slug": "astrahan",
"name": "Астрахань"
}
];
var sortedItems = items.sort((a, b) => a.slug.localeCompare(b.slug));
var results = {};
for (var i = 0; i < 26; i++) {
var char = String.fromCharCode(97 + i);
var bigChar = char.toUpperCase();
results[bigChar] = [];
for (var s = 0; s < sortedItems.length; s++) {
if (sortedItems[s].slug.startsWith(char)) {
results[bigChar].push(sortedItems[s]);
}
}
}
console.log(results)

Javascript Loop inside another loop make 2 lists

I have some data which looks like this:
{
"mains": [{
"id": "454",
"name": "main 1",
"subs": [{
"id": "32",
"name": "sub 1"
}, {
"id": "23",
"name": "sub 2"
}, {
"id": "54",
"name": "sub 3"
}],
"image": null
}, {
"id": "654",
"name": "main 2",
"subs": [{
"id": "87",
"name": "sub 1"
}, {
"id": "78",
"name": "sub 2"
}],
"image": null
}]
}
From this I need create 2 lists:
For creating the first list with all the mains …I’ve done this:
mainlist = [];
sublist = [];
for (var i = 0; i < data.mains.length; i++) {
var obj = data.mains[i];
var mnlst = obj.name;
mainlist.push(mnlst);
}
console.log(mainlist);
In this example it will return the names of the mains resulting in 2 names (in this case).
Now what I need to do it to get the names of the subs for each main
So sublist (in this case will return)
“sub 1, sub 2 and sub 3” for main 1 and “sub 1 and sub 2” for main 2 etc…
How can I do this?
You could use another data structure for the sublist with name of main as key.
var data = { "mains": [{ "id": "454", "name": "main 1", "subs": [{ "id": "32", "name": "sub 1" }, { "id": "23", "name": "sub 2" }, { "id": "54", "name": "sub 3" }], "image": null }, { "id": "654", "name": "main 2", "subs": [{ "id": "87", "name": "sub 1" }, { "id": "78", "name": "sub 2" }], "image": null }] },
mainlist = [],
sublist = Object.create(null);
data.mains.forEach(function (main) {
mainlist.push(main.name);
sublist[main.name] = main.subs.map(function (sub) {
return sub.name;
});
})
console.log(mainlist);
console.log(sublist['main 1']);
console.log(sublist);
.as-console-wrapper { max-height: 100% !important; top: 0; }
you actually had the right idea in your question title - nested loops, you need to iterate over the internal subs in each "main" like this:
mainlist = [];
sublist = {};
for (var i = 0; i < data.mains.length; i++) {
var obj = data.mains[i];
var mnlst = obj.name;
mainlist.push(mnlst);
var tempArr = [];
for(var j = 0; j < obj.subs.length ; j++){
var subObj = obj.subs[j];
var sblst = subObj.name;
tempArr.push(sblst);
}
sublist[mnlst] = tempArr;
}
I've changed sublist to be an Object and I place the "subs" in to a temp array before inserting them into sublist as keyd arrays (where the key is the main name) now you can use it like sublist['main 2'] to receive all the relevant subs
Let's modify you code.
mainlist = [];
sublist = [];
for (var i = 0; i < data.mains.length; i++) {
var obj = data.mains[i];
var mnlst = obj.name;
//--[Start Modification]--
var subArr = obj.subs;
for(var j = 0; j < subArr.length; j++)
{
var subName = subArr[i].name;
//Here you have subject name, do whatever you want to do with it.
}
//--[End Modification]--
mainlist.push(mnlst);
}
console.log(mainlist);

How to not repeat folders with JStree?

I have a JSON file with some data like this:
dataTree.json =
[
{
"datap": "816816816816816818",
"name": "image1.jpg",
"url": "/files/folder1/test/d2e9c54ceedc9/image1.jpg",
"path": "/files/folder1/test/image1.jpg",
"size": 35969
},
{
"datap": "857022de4fccdcb54623ff6185daae706a47140c",
"name": "image2.jpg",
"url": "/files/folder1/pruebas/85623ff6185d7140c/image2.jpg",
"path": "/files/folder1/pruebas/image2.jpg",
"size": 17689282
},
{
"datap": "b260ec3250420c953a9db41897c34e3551620ec325035516256b2/image3.jpg",
"path": "/files/folder1/test/image3.jpg",
"size": 710632
}
]
In this part I make the operation and the format for jstree
$.getJSON('/dataTree.json', function (response) {
var fullTree = [];
if (response == []){
var refullTree = []
}
else {
var refullTree = [{"id":null,"text":"Root","icon":"tree.png","state":null,"children":[]}]
}
function treeElements(element, tree){
var parts = element.path.split("/");
parts.splice(0,2);
for (var k in parts) {
var count = 0
var part = parts[k];
if (part == "") part = "#";
var item = {"id":null, "text": part, "icon": icon(part), "children": []};
tree.push(item);
tree = item.children;
}
function icon(search){
if (search.indexOf(".png",".jpg") > -1){
return "glyphicon glyphicon-picture" }
else if(search.indexOf("jpg",".jpg") > -1){
return "glyphicon glyphicon-picture" }
}
}
for (var i in response) {
treeElements(response[i], fullTree);
}
refullTree[0]["children"] = fullTree
});
The result is output in this format:
[
{
"id": null,
"text": "Root",
"icon": "tree.png",
"state": null,
"children": [
{
"id": null,
"text": "folder1",
"children": [
{
"id": null,
"text": "test",
"children": [
{
"id": null,
"text": "image1.jpg",
"icon": "glyphicon glyphicon-picture",
"children": []
}
]
}
]
},
{
"id": null,
"text": "folder1",
"children": [
{
"id": null,
"text": "pruebas",
"children": [
{
"id": null,
"text": "image2.jpg",
"icon": "glyphicon glyphicon-picture",
"children": []
}
]
}
]
},
{
"id": null,
"text": "folder1",
"children": [
{
"id": null,
"text": "test",
"children": [
{
"id": null,
"text": "image3.jpg",
"icon": "glyphicon glyphicon-picture",
"children": []
}
]
}
]
}
]
}
]
This tree was produced by jstree, and the three folders have the same name. I do not want to create three folders with the same name, I want that when I find a folder that exists, the data is entered into the that existing folder.
Instead, I want this:
Here is a demo of how to parse this structure: http://jsfiddle.net/DGAF4/506/
Here is the actual parsing code (also visible in the fiddle);
var tmp = {}, i, j, k, l, p1, p2, fin = [];
for(i = 0, j = a.length; i < j; i++) {
p1 = a[i].path.replace(/^\//,'').split('/');
p2 = '';
for(k = 0, l = p1.length; k < l; k++) {
tmp[p2 + '/' + p1[k]] = {
id : p2 + '/' + p1[k],
parent : p2 ? p2 : '#',
text : p1[k]
};
p2 += '/' + p1[k];
}
for(k in a[i]) {
if(a[i].hasOwnProperty(k)) {
tmp[a[i].path][k] = a[i][k];
}
}
if(a[i].path.match(/(jpg|png|jpeg)$/)) {
tmp[a[i].path].icon = "glyphicon glyphicon-picture";
}
}
for(i in tmp) {
if(tmp.hasOwnProperty(i)) {
fin.push(tmp[i]);
}
}
// fin contains the structure in a jstree compatible format

Loop within a Loop within a Loop within a Dream within a Dream

I'm trying to work with some API's and in return they give me a huge JSON object and I need to compare it with my JSON object, however, I have so many loops that it's just not funny anymore.
My current object looks like this:
var courses = {
art_117: {
course_folder: true,
sco_id: "12111",
subFolders: [{
folderName: "SET_01",
isFolder: true,
number: 1,
sco_id: "121116"
}, {
folderName: 'SET_06',
isFolder: true,
number: 6,
sco_id: '121117'
}]
}
}
The returning object looks like this:
var json = {
"status": {
"code": "ok"
},
"scos": {
"sco": [{
"name": "SET_01",
"url_path": "/134123/",
"is_seminar": "false",
"sco_id": "63453452",
"folder_id": "12111",
"type": "folder",
"icon": "folder",
"display_seq": "0",
"duration": "",
"is_folder": "1"
}, {
"name": "SET_02",
"url_path": "/f4r8y3l0sy6/",
"is_seminar": "false",
"sco_id": "123413",
"folder_id": "12111",
"type": "folder",
"icon": "folder",
"display_seq": "0",
"duration": "",
"is_folder": "1"
}, {
"name": "SET_03",
"url_path": "/f7d6lf2xbb1/",
"is_seminar": "false",
"sco_id": "12341234",
"folder_id": "12111",
"type": "folder",
"icon": "folder",
"display_seq": "0",
"duration": "",
"is_folder": "1"
}]
}
}
Here's my current code
if (typeof json.scos.sco != 'undefined') {
var scos = json.scos.sco;
var len = scos.length;
for (var i = 0; i < len; i++) {
var id = scos[i]['folder_id'];
var name = scos[i]['name'];
for (var j = 0; j < keys.length; j++) {
if (adobe.courses[keys[j]]['sco_id'] == id) {
var subFolders = adobe.courses[keys[j]]['subFolders'];
for (var k = 0; k < sections.length; k++) {
if (sections[k]['folderName'] == name) {
courses[keys[j]]['subFolders'][k]['sco_id'] = scos[i]['sco_id'];
courses[keys[j]]['subFolders'][k]['isFolder'] = true;
}
}
}
}
}
}
How can that be rewritten so that there isn't 3 nested loops?

Json Nested Object Array to Table

I have a json file, there is an array of objects. In the first object is a 2nd array with +/- 200 objects. Is there a possibility to show the 2nd array in a new table in the last row of the first table?
As seen here, there should be a nested table in the column: "Friends"
http://jsfiddle.net/TqbMC/
The html is:
<body onLoad="buildHtmlTable()">
<table id="excelDataTable" border="1">
</table>
</body>
The rest of the code is:
var myList=[{
"id": "220439",
"name": "Bret Taylor",
"friends": {
"data": [
{
"id": "100003461417780",
"name": "Pedro Fernandes"
},
{
"id": "100004448132997",
"name": "Tatiane Rodrigues"
},
{
"id": "100002608573875",
"name": "Gerson Yoody"
},
{
"id": "100003532942622",
"name": "Brennen Roup"
},
{
"id": "100003910478450",
"name": "Maruxita Gomez"
},
{
"id": "100003035179424",
"name": "Ekta Vaghasia"
},
{
"id": "100003034655176",
"name": "Nikita Adam"
},
{
"id": "100004269720826",
"name": "Lukas Ks"
},
{
"id": "100004489472386",
"name": "Hong Finozaza"
},
{
"id": "1436623789",
"name": "Dianita M Ct"
},
{
"id": "100004324535652",
"name": "Ana Paula"
},
{
"id": "100004433135086",
"name": "Caroline Geovannini"
},
{
"id": "100004081013147",
"name": "Ryan Bispo Silva"
},
{
"id": "1697844686",
"name": "Louann Hyatt Clark"
},
{
"id": "100003283377051",
"name": "Ysabel Salazar"
},
{
"id": "100003398360349",
"name": "Ty SoHigh Walker"
},
{
"id": "100001201489463",
"name": "Dicu Andrei D"
},
{
"id": "100001811128458",
"name": "Cristy Torres Castellanos"
},
{
"id": "1693121601",
"name": "Jasim Amit"
},
{
"id": "100001966217366",
"name": "Candy Chhokar"
},
{
"id": "100004096284395",
"name": "Stefania Bilska"
},
{
"id": "100004084157244",
"name": "Papah Noval"
},
{
"id": "1791202672",
"name": "Bianca Agostina Gherardini"
},
{
"id": "100000825894241",
"name": "Usman Faiz"
},
{
"id": "100002424916440",
"name": "Muhammad Tajminur Rahman"
}
],
"paging": {
"next": "https://graph.facebook.com/99394368305/likes?limit=25&after=MTAwMDAyNDI0OTE2NDQw"
}
}
}];
// Builds the HTML Table out of myList json data from Ivy restful service.
function buildHtmlTable() {
var columns = addAllColumnHeaders(myList);
for (var i = 0 ; i < myList.length ; i++) {
var row$ = $('<tr/>');
for (var colIndex = 0 ; colIndex < columns.length ; colIndex++) {
var cellValue = myList[i][columns[colIndex]];
if (cellValue == null) { cellValue = ""; }
row$.append($('<td/>').html(cellValue));
}
$("#excelDataTable").append(row$);
}
}
// Adds a header row to the table and returns the set of columns.
// Need to do union of keys from all records as some records may not contain
// all records
function addAllColumnHeaders(myList)
{
var columnSet = [];
var headerTr$ = $('<tr/>');
for (var i = 0 ; i < myList.length ; i++) {
var rowHash = myList[i];
for (var key in rowHash) {
if ($.inArray(key, columnSet) == -1){
columnSet.push(key);
headerTr$.append($('<th/>').html(key));
}
}
}
$("#excelDataTable").append(headerTr$);
return columnSet;
}
(the data comes from the facebook graph api)
you can access inner data in this way: myList[0].friends.data[i].id and myList[0].friends.data[i].name, just iterate until myList[0].friends.data.length is reached and build whatever structure you want - for example create table row for each friend with two td - one for id and one for name – magyar1984
http://jsfiddle.net/6v8Ew/1/
for (var x = 0 ; x < myList[0].friends.data.length ; x++){
$line.append( $( "<td></td>" ).html( myList[0].friends.data[x].id ) );
}

Categories

Resources