order.dt event capture the column name

order.dt event capture the column name

gc_retrogressgc_retrogress Posts: 4Questions: 2Answers: 0
edited June 2014 in Free community support

I would like to understand the event handling in datatables. When I look at the request parameter list, I see that "order[0][column]" specifies the column on which user requested ordering and the "columns[n][data]" ( where n is the value of "order[0][column]" ) specifies the column name for server to do order by column name.

I would like to know if I can use the the event "order.dt" event and fire a new ajax and then redraw the table with a custom name=value? Backend developers will find that easy...if they get orderColumnName=Critical in the request parameter list and fetch data from database by applying the requested order by.

My code...

      $('#example').dataTable({
                                "processing": true,
                                "serverSide": true,
                                "ajax": {
                             "url": "someURL",
                             "dataSrc": "data"
                         },
                        "aoColumnDefs"   : [
                             { 
                               "mData"    : "Id",
                               "sType"    : "integer",
                               "aTargets" : [ 0 ],            
                               "bSortable": false,            
                             },
                            { 
                               "mData"    : "Name",
                               "sType"    : "String",
                               "aTargets" : [ 1 ],             
                               "bSortable": true,             
                            },
                            { 
                               "mData"    : "critical",
                               "sType"    : "string",
                               "aTargets" : [ 2 ],             
                               "bSortable": false,           
                            }                              
        }); // end of jquery data table init

    $('#example').on( 'order.dt', function () { 
        // Can I read the column name here?
            // then I would like to fire a ajax and do datatable reload
    });
                    } );

Answers

  • allanallan Posts: 63,498Questions: 1Answers: 10,470 Site admin

    You can use the API in the event handler to determine the order applied to the table: order(). Remember that DataTables supports multi-column filtering, so it might not just be one column which is being ordered upon.

    Allan

  • gc_retrogressgc_retrogress Posts: 4Questions: 2Answers: 0
    edited June 2014

    so far I got the column name for corresponding column id like this below..

             $('#example').on( 'order.dt', function () {
    
                    var table = $('#example').dataTable();
                    var api = table.api();
                     var order = table.api().order(); // this has column and order details
                     var allData = table.api().columns().data();
                     var columnNameData = table.api().column(3).data();
                     var columnFromId = api.column('#column-3:name');
                     var objCols = table.fnSettings().aoColumns;
    
                     console.log('Column name for order[0][0]' + objCols[0].mData);
    
                });
    
  • allanallan Posts: 63,498Questions: 1Answers: 10,470 Site admin

    You really want to avoid using the settings object as much as possible. The contents of the object are considered to be private and they can and do change between versions.

    Also the mData property is not a name - it can be a function or various other types. What do you want it for?

    Allan

This discussion has been closed.