Insert datatable to row.Child()
Insert datatable to row.Child()
Muhahe
Posts: 25Questions: 8Answers: 2
Hello, is possible to insert another datatable to row.child().show? Im using this
if (showHideItems['p'+data.id] ==true){
//subtablesId.push('p'+data.id)
var tr = td.closest('tr');
var nRow = this.api().row( tr );
var elem = format(nRow.data())
var table = initializeSubTable(elem,allTasksData['p'+data.id]);
console.log(elem)
console.log(table)
nRow.child(table).show();
tr.addClass('shown');
}
Where table is initialized datatable from initializeSubTable function
function initializeSubTable(subtableElement, tableData){
var subTable = $(subtableElement).DataTable({
"dom": '<"cleaner">lf<"cleaner"><"cleaner"><"cleaner">rtip',
"stateSave": true,
"data":tableData,
"columns":[
{
"data": null,
"orderable": false,
"defaultContent": ''
},
{
"data": null
},
{
"data": null
},
{
"data": null
},
{
"data": null
},
{
"data": null
},
{
"data": null
},
{
"data": null
},
{
"data": null
},
{
"data": null
},
{
"data": null
},
{
"data": null
},
{
"data": null
}
],
"createdRow": function (row,data,index){
if(data.child != null){
$('td', row).eq(0).addClass('details-control')
if (showHideItems['t'+data.id] ==true){
}
}
},
"columnDefs": [
{
"targets":0,
"render": function (data, type, row){
return ''
}
},
{
"targets":1,
"render": function (data, type, row){
return '<a href='+data.taskLink+'>'+data.name+'</a>';
}
},
{
"targets":2,
"render": "customer"
},
{
"targets":3,
"render": "platform"
},
{
"targets":4,
"render": "product"
},
{
"targets":5,
"render": function (data, type, row){
if(data.userId == null){
return "none";
}else{
return '<a href=' + data.userLink + '>' + data.userName + ' ' + data.userSurname + '</a>';
}
}
},
{
"targets":6,
"render": function (data, type, row){
var date = data.start.date.split(" ")[0].split("-");
return date[2]+'.'+date[1]+'.'+date[0];
}
},
{
"targets":7,
"render": function (data, type, row){
var date = data.end.date.split(" ")[0].split("-");
return date[2]+'.'+date[1]+'.'+date[0];
}
},
{
"targets":8,
"render": function (data, type, row){
if (userRole == "viewOnly"){
if(data.finished == "1"){
return "Yes";
}else{
return "No";
}
}else{
if(data.finished=="1"){
return "<input type='checkbox' class='finish_button_uk' value='"+data.id+"' checked><span id='check_label_uk"+data.id+"'>Yes</span>";
}else{
return "<input type='checkbox' class='finish_button_uk' value='" + data.id + "'><span id='check_label_uk" + data.id + "'>No</span>";
}
}
}
},
{
"targets":9,
"render": "priority"
},
{
"targets":10,
"render": function (data, type, row){
if(data.log==""){
return "none";
}else{
return "<a href='file://" + data.log + "'><img src=" + basePath + "/images/log.png></a>";
}
}
},
{
"targets":11,
"render": "level"
},
{
"targets":12,
"render": function (data, type, row){
if (userRole == "viewOnly"){
return "";
}else{
return "<img src=" + basePath + "/images/deleteButton.png onclick='deleteProjectRow(this,"+data.id+");'>";
}
}
},
]
});
yadcf.init(subTable,[
{
column_number :1,
filter_type: "multi_select",
select_type: 'chosen',
use_dataTable_render: 'true'
},
{
column_number :2,
filter_type: "multi_select",
select_type: 'chosen',
use_dataTable_render: 'true'
},
{
column_number :3,
filter_type: "multi_select",
select_type: 'chosen',
use_dataTable_render: 'true'
},
{
column_number :4,
filter_type: "multi_select",
select_type: 'chosen',
use_dataTable_render: 'true'
},
{
column_number :5,
filter_type: "multi_select",
select_type: 'chosen',
use_dataTable_render: 'true'
},
{
column_number :6,
filter_type: "multi_select",
select_type: 'chosen',
use_dataTable_render: 'true'
},
{
column_number :7,
filter_type: "multi_select",
select_type: 'chosen',
use_dataTable_render: 'true'
},
{
column_number :8,
filter_type: "multi_select",
select_type: 'chosen',
use_dataTable_render: 'true'
},
{
column_number :9,
filter_type: "multi_select",
select_type: 'chosen',
use_dataTable_render: 'true'
},
])
subTable.on('click', 'td.details-control', function (event) {
event.stopPropagation();
//event.stopImmediatePropagation();
var tr = $(this).closest('tr');
var row = subTable.row( tr );
if ( row.child.isShown() ) {
// This row is already open - close it
row.child.hide();
tr.removeClass('shown');
delete showHideItems['t'+row.data().id]
}
else {
// Open this row
row.child( format(row.data()) ).show();
tr.addClass('shown');
showHideItems['t'+row.data().id] = true
if(! $.fn.DataTable.isDataTable('#subtable_t'+row.data().id)){
initializeSubTable('#subtable_t'+row.data().id,allTasksData['t'+row.data().id])
}
}
})
return subTable;
}
This discussion has been closed.