javascriptjqueryjqxgrid

Cant trigger Alert(); on Jqxgrid Checkbox

i am following this http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm?%28arctic%29#demos/jqxgrid/checkboxcolumn.htm what i wanna do is that i am trying to capture change on checkbox so far i have done this something like this but following dont trigger any thing can some tell me what i am missing here

jQuery('#jqxgrid').find('span').on("click",function() {
                    alert('i am here');
                });

jQuery('#jqxgrid').on("click",function() {
                        alert('This works but when i try to click on <span> that holds checkbox, it dont alert any thing other then this it works');
                    });

and my HTML is simply as follows

<body class='default'>
        <div id="jqxgrid"></div>
    </body>
Solution

  • Try to use event delegation if your elements have been added dynamically:

    $('body').on('click', '#jqxgrid span', function() {
    alert('i am here');
});

    As per comment, you can use .find():

    jQuery('#jqxgrid').on("click", function() {                 
    var span = jQuery(this).find('.jqx-checkbox-check-checked');
});