MVC + mvcContrib grid + DataTables + jeditable = awesomess

jcleve

First things first...Fantastic plug in!

I'm trying to get my concoction of technologies to play nicely but i'm running in an issue and I'm not sure which of my components is actually having the issue.

my view code looks like this:
[code]

<%
Html.Grid(Model).Columns(column =>
{
column.For(u => u.ID);
column.For(u => u.UserName);
column.For(u => u.FirstName);
column.For(u => u.LastName);
column.For(u => u.UserRole);
column.For(u => u.Active);

}).Attributes(id => "grid")
.RowAttributes(data => new Hash(id => data.Item.ID))
.Render(); %>

[/code]

Notice how I set the row 'id' attribute to my business object's ID above.

My javascript looks like this:

[code]
$(document).ready(function() {

oTable = $('#grid').dataTable({
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": 'http://localhost/ELIv2MVC/Users/PageFilterSort',
"aoColumns": [
/*ID*/{"bSearchable": false, "bVisible": false },
/*UserName*/null,
/*Firstname*/null,
/*LastName*/null,
/*UserRole*/null,
/*Active*/null
],
"fnDrawCallback": WireGrid
});


});

function WireGrid() {
$('#grid tbody td').editable('http://localhost/ELIv2MVC/Users/UpdateGrid', {
cancel: 'Cancel',
submit: 'OK',
"submitdata": function(value, settings) {
debugger;
return { "row_id": this.parentNode.getAttribute('id') };
}
});
}
[/code]

The problem is just above...where i'm trying to get the 'id' attribute from the table cell's parentNode. It always evaluates to null, but if I view source on the page, all my s have proper IDs. Interestingly, the class attribute is set to "odd" on the but when I view source, I see either 'gridrow' or gridrow_alternate'.

I'm wondering if I have a race condition occuring. Or maybe one of my components is stomping on another. Has anyone successfully assembled MVC, mvcContrib grid, dataTables with server-side processing, and jeditable with persisted changes?