Using Row-Details: using jquery function class on the "Formating function for row details"

mr_phillipus

Hi There,

I am implementing Row Details with a button function (ui)
Basically I want to put a customised button inside row details
here is my coding (have a look on "sOut += 'Extra info:....." (line 35)

Thanks in advance :)

[code]
$(function(){
// ICONs
$( ".sub_menu button:first" ).button({
icons: {
primary: "ui-icon-wrench"
}
}).next().button({
icons: {
primary: "ui-icon-closethick"
}
}).next().button({
icons: {
primary: "ui-icon-transferthick-e-w",
}
}).next().button({
icons: {
primary: "ui-icon-tag",
}
}).next().button({
icons: {
primary: "ui-icon-link",
}
});
});

var oTable;

/* Formating function for row details */
function fnFormatDetails ( nTr )
{
var aData = oTable.fnGetData( nTr );
var sOut = '';
sOut += 'Rendering engine:'+aData[2]+' '+aData[5]+'';
sOut += 'Link to source:Could provide a link here';
sOut += 'Extra info:EditDeleteMake OfferList OfferAssign';
sOut += '';

return sOut;
}

$(document).ready(function() {
oTable = $('#example').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "scripts/details_col.php",
"aoColumns": [
{ "sClass": "center", "bSortable": false },
null,
null,
null,
{ "sClass": "center" },
{ "sClass": "center" }
],
"aaSorting": [[1, 'asc']]
} );

$('#example tbody td img').live( 'click', function () {
var nTr = $(this).parents('tr')[0];
if ( oTable.fnIsOpen(nTr) )
{
/* This row is already open - close it */
this.src = "../examples_support/details_open.png";
oTable.fnClose( nTr );
}
else
{
/* Open this row */
this.src = "../examples_support/details_close.png";
oTable.fnOpen( nTr, fnFormatDetails(nTr), 'details' );
}
} );
} );
[/code]