datatable with details does not have icons added after paging to new page

DavidBoomer

this is in a .Net environment, and jQuery datatable code is being applied to a gridview ( using this fix for the thead and tbody attributes
http://www.codeproject.com/Articles/267001/GridviewFix-helper-plugin ). when i navigate to a new page, the icons for the details view are not being added until i click a link in the table, which causes an async postback. only thought i've had is to trap for the click on the navigation buttons, then run the datatable code again, but i'm unsure how to do that. fwiw, the only way i've gotten the jQuery code to bind at all to the second page is to put the document.ready, etc... code inside the asp builtin pageLoad function. this function, which runs with all full and async postbacks in asp, is not being triggered with the click of the jQuery pagination contols. maybe that's the simplest question i can ask: how can i attach an async postback event to the click of the navigation controls?

david

allan

I'm a bit confused I'm afraid - you want to add a POST to the DataTables paging navigation controls? As in a full refresh, or an Ajax table update?

Can you link to your page please?

Allan

DavidBoomer

ajax table update. the icons for opening and closing the details view of each row only appear on the initial page load, which triggers the Asp built in client side function 'pageLoad'. when i use the jQuery navigation controls, there seems to be no ajax or full postback, so the pageLoad function is not called, and therefore the details icons, and the new table column containing them, is not added. i can post code in a few hours when at work, but again, more simply, can an ajax table update be triggered when the datatable nav controls are clicked?

DavidBoomer

OK. I have solved the original problem, but now, because of using "GridviewFix-helper-plugin" i'm guessing, I am getting the green "+" icon in the header row of the inserted details row. Is there a jQuery method for suppressing the header display for a particular column?

allan

I'm still a bit confused I'm afraid :-). I don't know what the inserted details row looks like, but it sounds to me like you need to make the jQuery selector that you are using to put the green + icon in, more selective.

Allan

DavidBoomer

OK... ;-). Very new to jQuery. Thanks for bearing with me.

I think I need to add the gridviewfix right after document.ready, as a separate step:

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

var oTableTemp = $("#GridViewExample").GridviewFix(); //here

    var nCloneTd = document.createElement( 'td' );
    nCloneTd.innerHTML = '';
    nCloneTd.className = "center";
     
    $('#example thead tr').each( function () {
        this.insertBefore( nCloneTh, this.childNodes[0] );
    } );
     
    $('#example tbody tr').each( function () {
        this.insertBefore(  nCloneTd.cloneNode( true ), this.childNodes[0] );
    } );
    
/*
     * Initialse DataTables, with no sorting on the 'details' column
     */
    var oTable = oTableTemp.dataTable( { // syntax ??
        "aoColumnDefs": [
            { "bSortable": false, "aTargets": [ 0 ] }
        ],
        "aaSorting": [[1, 'asc']]
    });

// etc... from example at
// http://www.datatables.net/release-datatables/examples/api/row_details.html

}
[/code]

Right now the gridviewfix and the datatable initialization are chained together.

On iPad now. Will check syntax and code execution tomorrow at work.

Thanks, Allan.

DavidBoomer

The above seems to work, I'm happy to say.

Thanks, Allan.

allan

Good stuff - thanks for letting us know :-)

Allan