I'm trying to get a function work properly. When clicking on a row in a table, a pop up appears with the info(from the clicked row) auto filled in into textfields. This part works perfectly.

What i want to do now is that the function gets called ONLY if in the row it's not clicked on a button or a checkbox. The button part works, but not the checkbox.

It seems that event.target.nodeName != "CHECKBOX" isn't working.

Why doesn't he recognize the nodeName "checkbox"? Or am i doing it wrong ? I already searched the internet to find the nodeName for a checkbox. But no results :/

Sorry for my bad English!

    $('.management table.table-panies tbody tr').on('click touchstart',function(event) {
        if(
            event.target.nodeName != "BUTTON" 
            && event.target.nodeName != "I"
            && event.target.nodeName != "CHECKBOX"
            )
        {

            jmOpenRelatedContact($(this));

        }
    });

I'm trying to get a function work properly. When clicking on a row in a table, a pop up appears with the info(from the clicked row) auto filled in into textfields. This part works perfectly.

What i want to do now is that the function gets called ONLY if in the row it's not clicked on a button or a checkbox. The button part works, but not the checkbox.

It seems that event.target.nodeName != "CHECKBOX" isn't working.

Why doesn't he recognize the nodeName "checkbox"? Or am i doing it wrong ? I already searched the internet to find the nodeName for a checkbox. But no results :/

Sorry for my bad English!

    $('.management table.table-panies tbody tr').on('click touchstart',function(event) {
        if(
            event.target.nodeName != "BUTTON" 
            && event.target.nodeName != "I"
            && event.target.nodeName != "CHECKBOX"
            )
        {

            jmOpenRelatedContact($(this));

        }
    });

• javascript
• jquery
• html

• 3 Because the nodeName of <input type="checkbox"/> is "INPUT", not "CHECKBOX". – blex Commented Mar 13, 2015 at 21:45

3 Answers 3

You should use event.target.type instead of event.target.nodeName for input.

See the code:

var ctype = document.getElementById("c").type;
document.write("type="+ctype)

<input id="c" type="checkbox">

If you allow clicks on inputs that are not checkboxes, using nodeName != "INPUT" won't be right. In this case, you can use getAttribute() to find out if the type is "checkbox":

$('.management table.table-panies tbody tr').on('click touchstart',function(event) {
    if(
        event.target.nodeName != "BUTTON" 
        && event.target.nodeName != "I"
        && !(event.target.nodeName == "INPUT" && event.target.getAttribute('type') == "checkbox")
        )
    {

        jmOpenRelatedContact($(this));

    }
});

Edit: Check out RoliCo's answer, it's a good one.

The node name is 'INPUT', because a checkbox is defined like the following :

<input type="checkbox" name="animal" value="Cat" />
^^^^^
We are using an input element.

You could have figured that out by alerting the value of

event.target.nodeName

See by yourself : fiddle