get a column click in dataTables plugin instead of row

Question

I have the following code that works great for row click, but I want the first and last column to be clickable and I want to be able to tell which column was clicked. I have the following code

$(document).ready(function() {
    oTable = $('#mytable').dataTable();
    var fa = 0;
    $('#submit tbody td ').click(function() {
    var gCard = $('#mytable tbody').delegate("tr", "click", rowClick);


    });
    function rowClick() {
        fa = this;
        var id  = $("td:eq(1)", this).text();
        cardNumber = $.trim(id);    
        $.ajax({
            url : 'myurltopostto',
            type : 'POST',
            data : {
                id  :   id

            },
            success : function(data) {
                oTable.fnDraw(); //wanted to update here
            },
            error : function() {
                console.log('error');
            }
        });
    }

});

the code here is the row click

var gCard = $('#mytable tbody').delegate("tr", "click", rowClick);

what can I do for a cell click and get info.

using jquery plugin dataTables thanks

Ricardo Lohmann · Accepted Answer · 2012-06-28 23:23:06Z

6

When you do it $('#submit tbody td ').click(function() ... you bind click event to the td.
So, to get the first and last column click use the following:

$('td:first, td:last', '#submit tbody tr').on('click', function() {
    // do what you want
});

demo1

updated 1: Get last two columns:

jQuery('#mytable tr').each(function() {
    jQuery('td', this).slice(-2).on('click', function() {
        // do what you want
    });
});

demo2

update 2: Get each column data on click last two columns

jQuery('#mytable tr').each(function() {
    jQuery('td', this).slice(-2).on('click', function() {
        // do what you want
        var $columns = jQuery(this).siblings('td').andSelf();
        jQuery.each($columns, function(i, item) {
            alert(jQuery(item).html());
        });
    });
});

demo3

edited Jun 28, 2012 at 23:23

answered Jun 28, 2012 at 19:45

Ricardo Lohmann

26.4k7 gold badges86 silver badges84 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Ricardo Lohmann Over a year ago

Can you clarify your question please ?

Asim Zaidi Over a year ago

instead of first and last column, I just want the click on last two columns

Asim Zaidi Over a year ago

this works but only one issue? how would I get the values of the other cells??? it just gives me the values of the last two cells. I want to be able to only click last to cells but I need value of all the cells. Just not being able to click them.

Asim Zaidi Over a year ago

somethng like this jsfiddle.net/hua8Z/3 but it doesnt work...trying to get the value of first cell

Ricardo Lohmann Over a year ago

let us continue this discussion in chat

dejobo · Accepted Answer · 2014-05-14 22:06:31Z

2

Just specify a column number instead of first, last, etc. The example below shows column 12. zero is first. It's easier that way.

td:eq(11)

answered May 14, 2014 at 22:06

dejobo

1138 bronze badges

Comments

thejustv · Accepted Answer · 2015-10-14 09:48:17Z

0

$(document).ready(function() {
    var table = $('#tableID').DataTable();

    $('#tableID').on('click', 'tr', function () {
        var data = table.row( this ).data();
        alert( 'You clicked on '+data[0]+'\'s row' );
    } );
} );

for more refer this link

answered Oct 14, 2015 at 9:48

thejustv

2,02527 silver badges43 bronze badges

Collectives™ on Stack Overflow

get a column click in dataTables plugin instead of row

3 Answers 3

5 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related