Search and Sort Alters Data When Using fnCreatedRow

JanuszJasinski

I have the code below. As you can see, any greater than 2 has a class applies. The 3rd and 4th cell have an event attached to it. However when I search using the in-built form, the cells move across 3 to the right which means it's almost as the script is saying [code]$('td:eq(6), td:eq(7)', nRow).click(function () {[/code] rather than what is actually being said

[code]
$(document).ready(function () {
var oTable = $('#example').dataTable({
"bProcessing": true,
"bScrollCollapse": true,
"bSort": false,
"bServerSide": true,
"sAjaxSource": "data.asp",
"sServerMethod": "POST",
"sScrollX": "100%",
"fnCreatedRow": function (nRow, aData, iDisplayIndex) {

$("td:gt(2)", nRow).addClass('blue-link');
$('td:eq(3), td:eq(4)', nRow).click(function () {
$("#thedialog").attr('src', $(this).next('.dialog').attr("href"));
$("#somediv").dialog({
width: 800,
height: 600,
modal: true,
close: function () {
$("#thedialog").attr('src', "about:blank");
}
});
return false
});
},
"fnInitComplete": function () {
new FixedColumns(oTable, {
"iLeftColumns": 3,
"sHeightMatch": "auto"
});
}
});
});
[/code]

JanuszJasinski

This also happens when I sort on different columns

allan

Its because of the fixed columns. The cells are hidden (removed from the document) but your query doesn't take that into account. Currently you need to use http://datatables.net/plug-ins/api#fnGetTds - but it will be much easier in 1.10's new API.

Allan

JanuszJasinski

Ok thanks will give that a go - how would I "take it into account"? I actuallly want to sit down and learn the ins and outs properly but getting the time is tricky!

I have tried it - http://live.datatables.net/urasig/edit#javascript,html,live - but it only does one row?!?

JanuszJasinski

Is the following a suitable fix do you think?

[code]"fnInitComplete": function() {
new FixedColumns(oTable, {
"iLeftColumns": 3,
"sHeightMatch": "auto",
"fnDrawCallback": function() {
$('table#example tbody td').addClass('blue-link');
$('table#example tbody td:nth-child(1), table#example tbody td:nth-child(2)').click(function() {
$("#thedialog").attr('src', $(this).next('.dialog').attr("href"));
$("#somediv").dialog({
width: 800,
height: 600,
modal: true,
close: function() {
$("#thedialog").attr('src', "about:blank");
}
});
return false
});
}
});
}[/code]

allan

Probably as good as any for now :-)

Allan