[Please Help] Row Selection with Fixed column

hiren55

Dear Allen,

I am using datatable with fixed column plug in.
but when i click row on fixed columns, it doesn't select entire row but only selects Fixed column row.
could you please provide solution like 1. clicking fixed columns in row will select entire row or 2. disabling row select on fixed columns.

I haven't put link to test case as this is easy to produce scenario and am not working on live website. hope you will help without test case.

Thank You.

allan

You need to call fnUpdate on FixedColumns when you select the row - http://datatables.net/docs/FixedColumns/3.0.0/FixedColumns.html#fnUpdate .

I'll integrate events into it one day for selected rows, but it isn't in yet.

Allan

hiren55

Dear Allan,

Thank You for quick reply.
I added fc.fnupdate on child (oTable) table row select event as below.

fc = new FixedColumns( oTable, {
"iLeftColumns": 3,
"sHeightMatch" : "auto",
"iLeftWidth": 350
} );

oTable.$('tr').click( function () {
aData = oTable.fnGetData(this); // get datarow
fc.fnUpdate();
});

1. when clicked oTable rows, it updates fixed column row but on wrong index. :(
2. when i click fixed colum row, it doen't select child table row.

Am i doing something wrong? m sorry but m little new to javascript and jquery usages.

allan

That does look like it should work. If you are able to post a link to a test page showing the problem that would be very helpfully, if not, I'll try to create one on http://live.datatables.net when I get a bit of time to do so.

Allan

hiren55

Hi Allan,

unfortunatly i have no rights to share code link. i tried a lot fixing above case, but finally i have ended by droping usage of fixed column plug in. i removed it. in my project i am using almost 20 different datatables and all table has large no of rows which can not fit in single screen. so i wanted to fix main column.

anyways thank you very much for your all support and for such wonderfull datatables....

dacanetdev

I resolved in this way I don't know if it is the best way but got it working with live jquery event

I added rowData class to HTML code so when the fixed columns is created it has that class.
Then I Identified the new created table with the class DTFC_Cloned as selector

Hope it helps

$(".rowData").live("click", function () {
var row = $(this);

$("#grdTests tr.rowData").removeClass("rowData-selected");
$(".DTFC_Cloned tr.rowData").removeClass("rowData-selected");

var rowIndex = row.index() + 1;

if (row.parent().parent().hasClass("DTFC_Cloned")) {
$("#grdTests tr.rowData:nth-child(" + rowIndex + ")").addClass("rowData-selected");;
} else {
$(".DTFC_Cloned tr.rowData:nth-child(" + rowIndex + ")").addClass("rowData-selected");
}

row.addClass("rowData-selected");
});

ssaxer

@dacanetdev
Thank you very much! Works for me.

allan

Its worth pointing out that $().live() has been removed from the newer versions of jQuery. They recommend using $().on() now: docs.

Allan