Can't get Row Details to show (or icon column)

kdesilva

I can't seem to get this working .. here is the code I'm using..

[code]

<%= Html.JsInclude("~/Scripts/jquery.dataTables.js")%>
<%= Html.Stylesheet("~/Content/demo_table.css") %>



var oTable;

/* Formating function for row details */
function fnFormatDetails ( nTr )
{
var iIndex = oTable.fnGetPosition( nTr );
var aData = oTable.fnSettings().aoData[iIndex]._aData;

var sOut = '';
sOut += 'Rendering engine:test';
sOut += 'Link to source:Could provide a link here';
sOut += 'Extra info:And any further details here (images etc)';
sOut += '';

return sOut;
}

$(document).ready(function() {
//$('#participants').dataTable( {
//"sPaginationType": "full_numbers"

/*
* Insert a 'details' column to the table
*/
var nCloneTh = document.createElement( 'th' );
var nCloneTd = document.createElement( 'td' );
nCloneTd.innerHTML = '';
nCloneTd.className = "center";

$('#participants thead tr').each( function () {
this.insertBefore( nCloneTh, this.childNodes[0] );
} );

$('#participants tbody tr').each( function () {
this.insertBefore( nCloneTd.cloneNode( true ), this.childNodes[0] );
} );

/*
* Initialse DataTables, with no sorting on the 'details' column
*/
oTable = $('#participants').dataTable( {
"aoColumns": [
{ "bSortable": false },
null, null, null, null, null
],
"aaSorting": [[1, 'asc']]
});

/* Add event listener for opening and closing details
* Note that the indicator for showing which row is open is not controlled by DataTables,
* rather it is done here
*/
$('td img', oTable.fnGetNodes() ).each( function () {
$(this).click( function () {
var nTr = this.parentNode.parentNode;
if ( this.src.match('details_close') )
{
/* This row is already open - close it */
this.src = "/images/new.png";
oTable.fnClose( nTr );
}
else
{
/* Open this row */
this.src = "../examples_support/details_close.png";
oTable.fnOpen( nTr, fnFormatDetails(nTr), 'details' );
}
} );
} );
} );


} );


} );





Participants





<% if (ViewModel.Participants.Count == 0) { %>
No participants found for this event.
<% } else { %>

<% using ( Html.BeginForm( "RemoveParticipants", "Event" ) ) { %>

<%= this.Hidden( x => x.Event.Id ) %>

<%= this.SubmitButton( "Remove Selected Participants" ) %>




Name
Age
Category
Entry Date
Fee



<% foreach ( var registration in ViewModel.Participants ) { %>

<%= registration.Participant.Profile.FullName %>
<%= registration.Participant.Profile.Age %>
<%= registration.Category.Name %>
<%= registration.Date.ToShortDateString() %>
<%= string.Format( "{0:C2}", registration.TotalCost ) %>


<% } %>


<% } %>

<% } %>


[/code]

kdesilva

nevermind - silly syntax error!