EasyUIのSubGrid（jquery）におけるObjectに入れた連想配列について

EasyUIのSubGrid（jquery）におけるObjectに入れた連想配列をSubGrid内に展開する方法が知りたいです。

以下のコードを利用していますが
data:[]内ではforを回せないため、arrというObjectに入っている連想配列がすべて取り出せません。
arr[0]など行を指定すれば取れますが、これだと１行しか取れないため
全てを取り出す方法が知りたいです。


<table>
<tr><td>a1</td><td>a2</td><td>a3</td><td>a4</td><td>a5</td><td>a6</td></tr>
<tr><td>b1</td><td>b2</td><td>b3</td><td>b4</td><td>b5</td><td>b6</td></tr>
<tr><td>c1</td><td>c2</td><td>c3</td><td>c4</td><td>c5</td><td>c6</td></tr>
</table>

<script>
var arr = [];
var obj = {};

//テーブルの値をObject配列に格納する
$("tr").each(function(i){
obj = new Object();
$(this).children().each(function(j){
obj['test_column' + j] = $(this).text();
});
arr.push(obj);
});

var conf = {
options:{
},
subgrid:{
options:{
fitColumns:true,
foreignField:'companyid',
columns:[[
{field:'test_column1',title:'Column1',width:200, editor: 'text'},
{field:'test_column2',title:'Column2',width:200, editor: 'text'},
{field:'test_column3',title:'Column3',width:200, editor: 'text'},
{field:'test_column4',title:'Column4',width:200, editor: 'text'},
{field:'test_column5',title:'Column5',width:200, editor: 'text'},
{field:'test_column6',title:'Column6',width:200, editor: 'text'}
]],

//data:[]の配列内でforは回せないため、以下だとエラーになる
data:[
for (let i = 0; i < arr.length; i++) {
arr[i];
}

]

},
}
};
$(function(){
$('#dg').datagrid({
title:'DataGrid - Nested SubGrid'
}).datagrid('subgrid', conf);
});
</script>






【元となったEasyUIのコード】
https://www.jeasyui.com/demo/main/index.php?plug …

どうがよろしくお願いいたします。

No.1 ベストアンサー 回答者： fujillin 回答日時： 2022/05/02 13:47

こんにちは

EasyUIは全く存じませんが・・・

[]の記述形式は配列リテラルなので、ご指摘のように、直接値を示さない構文をその中で用いることはできません。
一方で、最初に設定している配列 arr の内容をそのまま、data 属性に設定したいのであれば、
　data : arr
で、設定できます。
ただし、この data 属性に求められる内容と、arr の内容が一致しているのかどうかは知りませんけれど・・
（EasyUIの仕様によりますので）


ご提示の配列 arr は
[
{ test_column1: 'a1', test_column2:'a2', test_column3: ・・・},
{ test_column1: 'b1', test_column2:'b2', test_column3: ・・・},
　　　・・・
]
のような構造になっていると思いますが、そのままで設定すればよいのなら、上記で可能です。
異なる構造で設定する必要があるのなら、求められる構造の配列（=arr2)に作成し直しておいて
　data: arr2
のような設定にすれば可能なはずと推測します。

要は、data属性に設定したい内容そのままを、別に作成しておけばよいってことになります。
その際であれば、ループでもなんでも自由に使えますので・・

この回答へのお礼

なるほど！

data:[arr]
ではなく
data: arr
とすればよかったのですね！

data:[[arr]]
としたり
data:[{arr}]
としたりしましたが、
配列リテラルというものが全く理解できておりませんでした。

素晴らしいご回答ありがとうございます！

お礼日時：2022/05/02 14:43