[英]creating an multidimensional Object dynamically from an multidimensional array
[英]creating dynamically multidimensional object / array
我正在嘗試使用JS創建多維數組,以便可以通過Ajax調用PHP發布一些數據。 這可能很簡單,但是我對JS的了解很少。
我想要的是某種像這樣的數組:
var data = {
bewaarnaam: 'bewaarnaam!',
rows: [{
row_1: [{
name: 'Row Name 1',
x: 450,
y: 250,
chest1: [{
counter: 1,
height: 5
}],
chest2: [{
counter: 2,
height: 3
}]
}],
row_2: [{
name: 'Row Name 2',
x: 650,
y: 550,
chest1: [{
counter: 1,
height: 8
}],
chest2: [{
counter: 2,
height: 4
}]
}],
}]
};
我試圖用這段代碼生成對象數組:
function saveThis() {
var bewaarNaam = $("#bewaarplaatsName").val();
hide_overlay_save_name();
log("now where going to save everything with the name: " + bewaarNaam);
var dataRows = [{
'bewaarnaam': bewaarNaam
}];
$(".rows").each(function (i, obj) {
var row = $(obj);
var rowName = $(row).attr('name');
var chests = [];
$(".cv_chest", row).each(function (i2, obj2) {
chests[$(obj2).attr('id')] = [{
'counter': $(obj2).attr('chest_counter'),
'height': $(obj2).attr('chest_height')
}];
});
var rowData = [{
rowName: [{
'name': $(row).attr('name'),
'x': $(row).css('left'),
'y': $(row).css('top'),
'chests': chests
}]
}];
dataRows[$(row).attr('id')] = rowData;
});
log(dataRows);
log("sending data with ajax...");
$.ajax({
type: 'post',
cache: false,
url: '{{ url('
bewaarplaatsen / nieuw ') }}',
data: dataRows
}).done(function (msg) {
log("ajax success");
log(msg);
}).fail(function (msg) {
log("ajax error");
log(msg);
});
}
當我將變量dataRows
輸出到控制台時,我得到以下輸出:
[Object, row_1: Array[1], row_2: Array[1]]
0: Object
bewaarnaam: "Bewaar Naam!"
__proto__: Object
length: 1
row_1: Array[1]
0: Object
rowName: Array[1]
0: Object
chests: Array[0]
chest_1_1: Array[1]
0: Object
counter: "1"
height: "1"
__proto__: Object
length: 1
依此類推...如果我使用console.log(JSON.stringify(dataRows));
記錄變量, 我得到以下輸出:
[{
"bewaarnaam": "Bewaar Naam!"
}]
如果我在控制台內執行var data =...
部分(第一個代碼塊),並將數據記錄到控制台,則會得到以下輸出(為了更好的可讀性,我再次使用`JSON.stringify函數對其進行了記錄) :
{
"bewaarnaam": "Bewaar Naam!",
"rows": [{
"row_1": [{
"name": "Row Name 1",
"x": 450,
"y": 250,
"chest1": [{
"counter": 1,
"height": 5
}],
"chest2": [{
"counter": 2,
"height": 3
}]
}],
"row_2": [{
"name": "Row Name 2",
"x": 650,
"y": 550,
"chest1": [{
"counter": 1,
"height": 8
}],
"chest2": [{
"counter": 2,
"height": 4
}]
}]
}]
}
如果在PHP中使用print_r
POST
值, print_r
得到以下輸出:
Array
(
[undefined] =>
)
當我使用Chrome調試Ajax請求時,可以看到Form Data
2個undefineds
:
Form data
undefined:
undefined:
因此,如果我理解正確,是對象創建不正確,因此不能正確地使用Ajax發送對象。 因此,PHP無法對發布數據執行任何操作...
所以我的問題很簡單...我做錯了/如何解決這個問題?
您正在混合數組和對象。 在javascript中,如果您使用{key:value}
,則需要一個對象而不是一個數組。 如果要[value,value,value]
它是一個數組。 當您說x=[{}]
,實際上是在數組內創建一個對象,但是隨后您要在數組上設置屬性(數組也是對象),而不是在正確的對象中。
您最可能想要的只是在任何地方使用對象並擺脫所有數組:
var dataRows = {
'bewaarnaam': bewaarNaam,
rows:{}
};
$(".rows").each(function (i, obj) {
var row = $(obj);
var rowName = $(row).attr('name');
var chests = {};
$(".cv_chest", row).each(function (i2, obj2) {
log("another chest with id: " + $(obj2).attr('id'));
chests[$(obj2).attr('id')] = {
'counter': $(obj2).attr('chest_counter'),
'height': $(obj2).attr('chest_height')
};
});
var rowData = {
rowName: {
'name': $(row).attr('name'),
'x': $(row).css('left'),
'y': $(row).css('top'),
'chests': chests
}
};
dataRows.rows[$(row).attr('id')] = rowData;
});
這會創建一個像
{
"bewaarnaam": "Bewaar Naam!",
"rows": {
"row_1": {
"rowName": {
"name": "Rij 1",
"x": "30px",
"y": "120px",
"chests": {
"chest_1_1": {
"counter": "1",
"height": "3"
},
"chest_1_2": {
"counter": "2",
"height": "3"
},
"chest_1_3": {
"counter": "3",
"height": "3"
},
"chest_1_4": {
"counter": "4",
"height": "3"
},
"chest_1_5": {
"counter": "5",
"height": "3"
}
}
}
},
"row_2": {
"rowName": {
"name": "Rij 2",
"x": "30px",
"y": "200px",
"chests": {
"chest_2_1": {
"counter": "1",
"height": "6"
},
"chest_2_2": {
"counter": "2",
"height": "6"
},
"chest_2_3": {
"counter": "3",
"height": "6"
},
"chest_2_4": {
"counter": "4",
"height": "6"
}
}
}
}
}
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.