JQuery get the value of checkbox and html

Question

I would like to enable the user to select a checkbox in a table, and then display the next table cell row data.

I have created a test project

http://jsfiddle.net/tonymaloney1971/8n4c42ap/

So, in my example if you select checkbox on row 1, I would like a alert box displaying item 1.

$("input[type='checkbox']").change(function (e) {
    if ($(this).is(":checked")) {
        $(this).closest('tr').addClass("highlight_row");
        //this errors?
        var itemID = $('.record_table', this).html();
        alert(itemID);
    } else {
        $(this).closest('tr').removeClass("highlight_row");
    }
});

Thanks

Yogesh Sharma · Accepted Answer · 2014-08-12 14:57:00Z

You can check Demo

Below is updated JS code

$(document).ready(function () {
    $('.record_table tr').click(function (event) {
        if (event.target.type !== 'checkbox') {
            $(':checkbox', this).trigger('click');
        }
    });

    $("input[type='checkbox']").change(function (e) {
        if ($(this).is(":checked")) {
            $(this).closest('tr').addClass("highlight_row");
            //this errors?
            var itemID = $(this).parent('td').next('td').html();
            alert(itemID);
        } else {
            $(this).closest('tr').removeClass("highlight_row");
        }
    });
});

I think it will help you

Mritunjay · Accepted Answer · 2014-08-12 14:55:27Z

1

Try this to achieve

 var itemID = $(this).parent().next().html();
 alert(itemID);

DEMO

answered Aug 12, 2014 at 14:55

Mritunjay

25.9k7 gold badges57 silver badges71 bronze badges

Comments

Amin Jafari · Accepted Answer · 2014-08-12 15:01:43Z

here you go: DEMO

$(document).ready(function () {
    $('.record_table tr').click(function (event) {
        if (event.target.type !== 'checkbox') {
            $(':checkbox', this).trigger('click');
        }
    });

    $("input[type='checkbox']").change(function (e) {
        if ($(this).is(":checked")) {
            $(this).closest('tr').addClass("highlight_row");
            var itemID = $(this).parent().siblings('td').html();
            alert(itemID);
        } else {
            $(this).closest('tr').removeClass("highlight_row");
        }
    });
});

Collectives™ on Stack Overflow

JQuery get the value of checkbox and html

3 Answers 3

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Related