Hello,
I would like to do : https://datatables.net/examples/api/row_details.html
Parent row : Nom - Adresse - CodePostal - Ville - Pays
Children row : Telephone - Telecopie - SiteInternet - SiteSupport
The data is stored in the table name : 'Para_Editeur'
I work with database SQL Server.
- How I can add icon "+" on the rows of my table ?
- How I search the data of my row parent ?
My script 'editeur.js' (Datatable parent):
/* Formatting function for row details - modify as you need */
function format ( d ) {
// `d` is the original data object for the row
return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">'+
'<tr>'+
'<td>Téléphone :</td>'+
'<td>'+d.Telephone+'</td>'+
'</tr>'+
'<tr>'+
'<td>Télécopie :</td>'+
'<td>'+d.Telecopie+'</td>'+
'</tr>'+
'<tr>'+
'<td>Site Internet :</td>'+
'<td>'+d.SiteInternet+'</td>'+
'</tr>'+
'<tr>'+
'<td>Site Support :</td>'+
'<td>'+d.SiteSupport+'</td>'+
'</tr>'+
'</table>';
}
$(document).ready(function() {
var table = $('#table_editeur').DataTable( {
"bProcessing": true,
"serverSide": true,
"ajax":{
url :"./response-displayrow_editeur.php", // json datasource
type: "post", // type of method ,GET/POST/DELETE
error: function(){
$("#table_editeur_processing").css("display","none");
}
},
"columns": [
{
"className": 'details-control',
"orderable": false,
"data": null,
"defaultContent": '',
},
{ "data": "Nom" },
{ "data": "Adresse" },
{ "data": "CodePostal" },
{ "data": "Ville" },
{ "data": "Pays" },
{ "data": "Telephone" },
{ "data": "Telecopie" },
{ "data": "SiteInternet" },
{ "data": "SiteSupport" },
],
"order": [[1, 'asc']]
} );
// Add event listener for opening and closing details
$('#table_editeur tbody').on('click', 'td.details-control', function () {
var tr = $(this).closest('tr');
// var tdi = tr.find("i.fa");
var row = table.row( tr );
if ( row.child.isShown() ) {
// This row is already open - close it
row.child.hide();
// tr.find('svg').attr('data-icon', 'plus-circle');
tr.removeClass('shown');
// tdi.first().removeClass('fa-minus-square');
// tdi.first().addClass('fa-plus-square');
}
else {
// Open this row
row.child( format(row.data()) ).show();
// row.child(format(tr.data('ACA'), tr.data('ACA'))).show();
// tr.find('svg').attr('data-icon', 'minus-circle');
tr.addClass('shown');
// tdi.first().removeClass('fa-plus-square');
// tdi.first().addClass('fa-minus-square');
}
} );
} );
My script 'response-displayrow_editeur.php' (Datatable parent):
<?php
//include connection file
include_once(".\db_connection.php");
// getting total number records without any search
$sql = "SELECT dbo.Para_Editeur.Nom,dbo.Para_Editeur.Telephone,dbo.Para_Editeur.Telecopie,dbo.Para_Editeur.SiteInternet,dbo.Para_Editeur.SiteSupport FROM dbo.Para_Editeur";
$stmt = sqlsrv_query( $conn, $sql);
if( $stmt === false ) {
die( print_r( sqlsrv_errors(), true));
}
//iterate on results row and create new index array of data
while( $obj = sqlsrv_fetch_object( $stmt)) {
$data[] = $obj;
}
echo json_encode($json_data); // send data as json format
?>
Thank you for help