CODEWITHSUNDEEP
jqueryeventsclickrow
user1286956
user1286956

Reputation: 299

Disable jQuery click event on child elements

I have a table on which I made all table rows to be click-able in relation to the nested links inside them. But I'm trying to disable specific table rows to stop being clicked once they have a class associated with them.

<script>
$('.selectable tr').click( function() {
    var productLink = $(this).find("a");

    productLink.attr("target", "_doc");
    window.open(productLink.attr("href"));

    return false;
});

$('.vandut_activ').click( function() {
    $(this).attr('disabled', 'disabled');
    return false;
});
</script>

The problem is that when I click the table row with .vandut_activ it still opens a new tab which is empty since it has no link inside to access. How do I stop the click event in this case? Thanks for your help!

Upvotes: 1

Views: 1785

Answers (2)

Dhiraj
Dhiraj

Reputation: 98

if you don't want that click to work on 'tr' which are having 'vandut_activ' class then you can try this,

hope that this is what you are looking for

$('.selectable tr:not(.vandut_activ)').on('click', function() {
var productLink = $(this).find("a");

productLink.attr("target", "_doc");
window.open(productLink.attr("href"));

return false;});

Upvotes: 1

Mayur Patel
Mayur Patel

Reputation: 1751

I don't know your jQuery version but from jQuery1.6+ you should use $("input").prop('disabled', true); for disabling event. Try bellow code(NOT TESTED)

Option 1:

<script>
$('.selectable tr').click( function() {
    var productLink = $(this).find("a");

    productLink.attr("target", "_doc");
    window.open(productLink.attr("href"));

    return false;
});

$('.vandut_activ').click( function() {
    $(this).prop('disabled', true);
    return false;
});
</script>

Option 2:

You can use css property pointer-events to disable click event.

<script>
$('.selectable tr').click( function() {
    var productLink = $(this).find("a");

    productLink.attr("target", "_doc");
    window.open(productLink.attr("href"));

    return false;
});

$('.vandut_activ').click( function() {
    $(this).css('pointer-events','none');
    return false;
});
</script>

Upvotes: 2

Related Questions