retreive column idx when clicking on header

retreive column idx when clicking on header

jfrjfr Posts: 71Questions: 24Answers: 0

Hi
I would like to retrieve a column header when right clicking on column header
I get div.DataTables_sort_wrapper or th.sorting in this when jQuery("#mytable thead").on("click", "th", function(event)
Can't fin how if the click is not in the tbody

Thank in advance

This question has an accepted answers - jump to answer

Answers

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

    To get the column index when clicking in the header you could use:

    $('#myTable').on( 'click', 'thead th', function () {
      var index = table.column( this ).index();
    } );
    

    Allan

  • jfrjfr Posts: 71Questions: 24Answers: 0

    Hi Allan
    I have tried a couple of thing

    var oTable;
    jQuery(document).ready(function(){
        oTable = jQuery("#mytable").DataTable( {
                +++
            });
        
        jQuery("#mytable thead").on("mousedown",  function (event) {
        // jQuery("#mytable").on("mousedown", "thead th", function (event) {
        // jQuery("#mytable").on("mousedown", "thead", function (event) {
             if (event.which == 3) {
                var idx = oTable.column( this ).index();
                var headtitle = oTable.column( idx ).header();
            }
        });
    });
    

    The only one that get fire is the first one and this has only the hmtl of the thead
    What I am trying to do is to initializes a qtip menu with column header and index data on right click

    Thanks in advance

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

    The first one isn't going to work as this is the thead - likewise the third. The second looks like it should - what happens if you use it? What about if you add console.log( this );?

    Can you link to the page please so I can take a look?

    Allan

  • jfrjfr Posts: 71Questions: 24Answers: 0

    Hi Allan
    I have done the following

    "infoCallback": function( settings, start, end, max, total, pre ) {
        oTable.columns().iterator( 'column', function ( tso, index, tco, cci ) {
            var header = oTable.column(index).header();
            }; 
        });
    },
    

    It works
    I am thinking of moving the code in drawCallback instead
    PS
    I had the same working result with

    jQuery("#mytable thead").on("mousedown", "th", function (event) {
       var idx = oTable.column( this ).index();
    }
    

    Thanks a lot for your precious help

This discussion has been closed.