ASP.net c# Gridview works ok until i click the edit link and trigger the RowEditing event

MoiD101

Hi, i have a Gridview working fine with datatables apart from when i click the edit link and send the page into edit row mode.
The row being edited is thrown to the bottom of the table making it look like the last record and also send the width off outside of the table container.
I am only really using DT for the search function and the column ordering.
Any help or advice would be really welcome right now ;)

catmom

I am having the same problem with a Listview. Did you ever find a solution to this?

MoiD101

Yes i figured it out see the code below (i labeled it for quick reference)
Also i turned off all of the padding in the CSS which solved the issue of it running outside of the Gridview.
[code] //Apply JQuery Datatables to the Gridview.
var oTable = $("#MainContent_gvPSTNResults").dataTable({
"aaSorting": [], //Remove all initial sorting (prevents the edit column being sorted initially).
"aoColumnDefs": [
{ "bSortable": false, "aTargets": [0]}//dont allow the first column to be sortable on clicking the header.
],
"bPaginate": false, //Turn off paging, the team will want to see all of the records in one page.
"bAutoWidth": false, //Dont need autowidth ASP.net GridView handles this.
"bStateSave": true, //Remember the changes to the datatables IE the text sort criteria.
"sDom": '<"top"if>t<"bottom"i><"clear">',//places the table info and text filtering above the table.
"fnInitComplete": function () {
var oSettings = $('#MainContent_gvPSTNResults').dataTable().fnSettings();
for (var i = 0; i < oSettings.aoPreSearchCols.length; i++) {
if (oSettings.aoPreSearchCols[i].sSearch.length > 0) {
$("thead input")[i].value = oSettings.aoPreSearchCols[i].sSearch;
$("thead input")[i].className = "";
}
}
}
});
[/code]