未为添加到dom的行选择所有复选框列

I have a grid to which I can dynamically add rows and columns. Each column has a checkbox next to it and checking it makes all checkboxes for that column be selected.

我有一个网格，我可以动态添加行和列。每列旁边都有一个复选框，选中它会使该列的所有复选框都被选中。

It looks like this:

它看起来像这样：

Below is my code to add columns by clicking the "Add another column" button.

下面是我通过单击“添加其他列”按钮添加列的代码。

$('#btnAddCol').click(function () {
    myfrom.find('tr').each(function(){
        var trow = $(this);
        var columnName = $('#colorName').val()
        if(trow.index() === 1){
          trow.append('<th > ' + columnName + ' <input type="checkbox" class="colmaster"/>');
        }else if (trow.index() > 1){
            trow.append('<td><input type="checkbox" name="'+columnName+'" class="child" /></td>');
        }
    });
    iter += 1;
});

And here is the code for selecting all checkboxes in the column.

这是用于选择列中所有复选框的代码。

$('.colmaster').click(function(){
 var idx = $(this).parent().index();
 $('#colorgrid td:nth-child(' + (idx + 1) + ') input.child').prop('checked', this.checked);
})

Question For the newly added columns, justadded in the screenshot above, when I check the checkbox it doesn't seem to select all checkboxes in that column

问题对于新添加的列，刚刚在上面的屏幕截图中添加，当我选中复选框时，它似乎没有选中该列中的所有复选框

Here is a working fiddle for everything: http://jsfiddle.net/y55nn1qx/4/

这是一切工作的小提琴：http：//jsfiddle.net/y55nn1qx/4/

2 个解决方案

#1

$('.colmaster').click will only bind the event to .colmaster elements that exist at the time of running the code. Try something like this:

$（'。colmaster'）。click只会将事件绑定到运行代码时存在的.colmaster元素。尝试这样的事情：

$('#colorgrid').on('click', '.colmaster', function() {
     // insert your .colmaster.click code here
});

Here's the jQuery API reference for on.

这是关于on的jQuery API参考。

2 个解决方案

#1

更多相关文章

随机推荐