Javascript 在复杂标头不工作的Jquery datatable上呈现列函数(数据、类型、完整)
我是jquery新手,尝试从json响应设计一个具有复杂头的datatable 到目前为止,数据是根据需求填充的,但现在我想基于json数据或其他列数据更改同一数据表中的一些列数据 在一个简单的jquery数据表中,使用函数(data,type,full)呈现列的功能有助于通过写入full[columnIndex]来访问其他列,但在复杂的头数据表中,它不起作用,并且给出了未定义的值 请帮助我,让我知道我应该写什么代码才能动态访问datatable的其他列 这是我的密码:Javascript 在复杂标头不工作的Jquery datatable上呈现列函数(数据、类型、完整),javascript,jquery,html,datatables,Javascript,Jquery,Html,Datatables,我是jquery新手,尝试从json响应设计一个具有复杂头的datatable 到目前为止,数据是根据需求填充的,但现在我想基于json数据或其他列数据更改同一数据表中的一些列数据 在一个简单的jquery数据表中,使用函数(data,type,full)呈现列的功能有助于通过写入full[columnIndex]来访问其他列,但在复杂的头数据表中,它不起作用,并且给出了未定义的值 请帮助我,让我知道我应该写什么代码才能动态访问datatable的其他列 这是我的密码: $('#example'
$('#example').dataTable({
"responsive": true,
"aaData": data,
"aoColumns": [{
"sTitle": "EVENT ID",
"defaultContent": "",
"mData": "eventId",
"render": function(val, type, full) {
//alert("event id :: " + val + " ::: " + full[0]+" ::: " );
return '<td id=event>' + val + '</td>';
}
},
{ "mData": "ecid_1.ecid" },
{ "mData": "ecid_1.name" },
{ "mData": "ecid_1.address" },
{ "mData": "ecid_2.ecid" },
{ "mData": "ecid_2.name" },
{ "mData": "ecid_2.address" },
{
"sTitle": "EVENT DATE",
"defaultContent": ""
},
{
"defaultContent": "",
"render": function(val, type, full) {
var event = full[0];
//data[0].eventId
alert(event);
if (val == "" || val == null) {
//alert('<input align="left" id="radio1" type="radio" name="action'+i+'" value="Approve">Approve</input><br/><input align="left" id="radio2" type="radio" name="action'+i+'" value="Reject">Reject</input>');
return '<input align="left" id="radio1" type="radio" name="action" value="Approve" onclick="updateEvent('' + event + '','' + full[1] + '','approve','' + full[4] + '','' + +'');">Approve</input><br/><input align="left" id="radio2" type="radio" name="action" value="Reject" onclick="updateEvent('' + event + '','' + full[1] + '','reject','' + full[4] + '','' + +'');">Reject</input>';
} else {
return val;
}
//alert("action:::"+data);
}
},
{
"sTitle": "ACTION DATE",
"defaultContent": ""
},
{
"sTitle": "ACTION COMMENTS",
"defaultContent": "",
"render": function(data, type, full) {
if (full[4] == "" || full[4] == null) {
//alert('<input align="left" id="radio1" type="radio" name="action'+i+'" value="Approve">Approve</input><br/><input align="left" id="radio2" type="radio" name="action'+i+'" value="Reject">Reject</input>');
return '<textarea id="comment" type="text" name="comment" value"aaa"></textarea>';
} else {
return '<textarea readonly style="background-color:#D3D3D3;" id="comment" name="comment">' + data + '</textarea>';
}
//alert("action:::"+data);
}
},
{
"render": function(data, type, full) {
var table = $('#example').DataTable();
var rowIndex = $(this).closest('tr').index();
//alert(full[2]);
return '<a href="/MatchMergeAPI/jsp/details.jsp#someRoute?ecid1=' + full[1] + '&ecid2=' + full[2] + '&event=' + full[0] + '"><img src="/MatchMergeAPI/img/eventDetails.jpeg" alt="" style="width: 120px; height: 50px;" /></a>';
}
}
]
});
$('#示例')。数据表({
“响应”:正确,
“aaData”:数据,
“aoColumns”:[{
“缝合”:“事件ID”,
“defaultContent”:“,
“mData”:“eventId”,
“渲染”:函数(val、类型、完整){
//警报(“事件id::“+val+”::“+full[0]+”::”;
返回“+val+”;
}
},
{“mData”:“ecid_1.ecid”},
{“mData”:“ecid_1.name”},
{“mData”:“ecid_1.地址”},
{“mData”:“ecid_2.ecid”},
{“mData”:“ecid_2.name”},
{“mData”:“ecid_2.地址”},
{
“缝合”:“活动日期”,
“defaultContent”:”
},
{
“defaultContent”:“,
“渲染”:函数(val、类型、完整){
var事件=完整[0];
//数据[0]。事件ID
警报(事件);
如果(val==“”| val==null){
//警报(“批准
拒绝”);
返回“批准
拒绝”;
}否则{
返回val;
}
//警报(“操作::”+数据);
}
},
{
“缝合”:“行动日期”,
“defaultContent”:”
},
{
“缝合”:“操作注释”,
“defaultContent”:“,
“渲染”:函数(数据、类型、完整){
if(满[4]==“”| |满[4]==null){
//警报(“批准
拒绝”);
返回“”;
}否则{
返回“”+数据+“”;
}
//警报(“操作::”+数据);
}
},
{
“渲染”:函数(数据、类型、完整){
变量表=$(“#示例”).DataTable();
var rowIndex=$(this.closest('tr').index();
//警报(完整[2]);
返回“”;
}
}
]
});
我的数据表现在如下所示:
在这里,您可以看到
ACTION
列,该列本应根据渲染功能提供一个单选按钮,但现在提供数据数组Ok,因此经过多次尝试,我也找到了解决方案。
在render函数(data,type,full)中,我们获取full中的行数据数组,因此要获取任何一个列值,我们必须实际使用键从数组中获取它,并且键与json对象完全相同
因此,如果我想在任何其他列中获取eventId,那么代码将如下所示:
function(data,type,full){
var eventId = full['eventId'];
return eventId;
}