Unable to show details row

jasonaleski

I'm having some issues getting my Data Tables to work correctly. I've been working on this for almost four days now.

1) I am unable to get the details row to show. It is getting to the logic because the +/- icon will change, but the detail is not showing. I think this is mainly because the nTr variable is not getting set, but not sure how to correct it.

2) When the icon does change to "-" when clicked (although the details do not show), it will not change back to the "+" when clicked again. It still thinks it is trying to open the record, which may be due to issue #1

3) In the function that displays the Detail Record, I get an error that says my variable is null, but yet the variable is output on the initial summary table.

Here is my code from the Head area

[code]


function fnFormatDetails(oTable,nTr){
var oData = oTable.fnGetData(nTr);

var sOut = ''+
''+
'Location Information'+oData.LOCNBR+''+
''+
'';
console.log("DETAIL RECORD: "+sOut);
return sOut;
}

$(document).ready(function(){
var anOpen = [];
var sImageUrl = "includes/";

var oTable = $('#example').dataTable( {
"bProcessing": true,
"sAjaxSource": "json.php",
"aoColumns": [
{ "mDataProp": null,
"sClass": "control center",
"sDefaultContent": ''
},
{"mDataProp": "SONBR"},
{"mDataProp": "LOCNBR"},
{"mDataProp": "SOAD2"}
]
});
console.log("STATUS: Data tables initialized.");

$('#example tbody').on('click', 'td img', function () {

var nTr = this.parentNode.parentNode.parentNode;
var i = $.inArray( nTr, anOpen );

console.log("VALUES: ntr = "+nTr);
console.log("VALUES: i = "+i);

if (oTable.fnIsOpen(nTr)) {
console.log("CLICK: Close Details");
this.src = sImageUrl+"details_open.png";
$('div.innerDetails', $(nTr).next()[0]).slideUp( function () {
oTable.fnClose( nTr );
anOpen.splice( i, 1 );
});
}else{
console.log("CLICK: Open Details");
this.src = sImageUrl+"details_close.png";
var nDetailsRow = fnFormatDetails(oTable, nTr);
$('div.innerDetails', nDetailsRow).slideDown();
anOpen.push( nTr );
}
});
});

[/code]

Here is my Body code
[code]
Data Tables





Service Order
Location
Address 2




[/code]

Here is my console log
[code]
STATUS: Data tables initialized. 192.168.0.220/test/:48
VALUES: ntr = [object HTMLTableSectionElement] 192.168.0.220/test/:55
VALUES: i = -1 192.168.0.220/test/:56
CLICK: Open Details 192.168.0.220/test/:66
Uncaught TypeError: Cannot read property 'LOCNBR' of null 192.168.0.220/test/:24
VALUES: ntr = [object HTMLTableSectionElement] 192.168.0.220/test/:55
VALUES: i = -1 192.168.0.220/test/:56
CLICK: Open Details 192.168.0.220/test/:66
Uncaught TypeError: Cannot read property 'LOCNBR' of null 192.168.0.220/test/:24
VALUES: ntr = [object HTMLTableSectionElement] 192.168.0.220/test/:55
VALUES: i = -1 192.168.0.220/test/:56
CLICK: Open Details 192.168.0.220/test/:66
Uncaught TypeError: Cannot read property 'LOCNBR' of null 192.168.0.220/test/:24
[/code]

I'm still continuing to work on it, and will post any changes, but would appreciate any suggestions.

allan

Please link to a test case showing the issue: http://datatables.net/forums/discussion/12899/post-test-cases-when-asking-for-help-please-read

Allan

jasonaleski

http://live.datatables.net/aricix/edit#javascript,html