复选框绑定在动态创建的列中不起作用

Question

在我的角应用程序中，我是从javascript动态创建表格的。

MaklerID

这是我如何生成列

$("#tableName").html("<table id='dtData' name='dtData' dt-options='dtOptions' dt-columns='dtColumns' class='table table-striped table-bordered'></table>");

这是var header = data[0], dtColumns = []; //create columns based on first row in dataset for (var key in header) { // console.log(key); if(key == "sendEmail") { dtColumns.push(DTColumnBuilder.newColumn(key).withTitle("Send Email").renderWith(actionsHtml)); } else { dtColumns.push(DTColumnBuilder.newColumn(key).withTitle(key)); } } 函数

actionsHtml

在这里，我最终确定了这张表

    function actionsHtml(data, type, full, meta) {

    return '<input type="checkbox" name="sendEmail" value="' + data+'">';
}

它创建了表格，然后是一列复选框类型，但它没有将值绑定到复选框。这是桌子 Berkeley CS 106

和列

的控制台值

但问题是.. chechbox列绑定无法正常工作..无论是从html还是在javascript中检查/取消选中它，它都不会对表/原始列表进行任何更改。

任何形式的帮助都将受到赞赏。

Answer 1

您可以通过简单的if / else数据解决此问题..如果数据为true，则不添加checked属性。然后捕获onClick事件并将某种Id传递给该函数并相应地更新值。

像这样的东西

if(key == "SendEmail")
{                   

dtColumns.push(DTColumnBuilder.newColumn(key).withTitle("Send Email")
.renderWith(function(data, type, full, meta) {
if(data){
            return '<input type="checkbox" checked="checked" name="SendEmail" onClick="SendEmail_Clicked('+Id+')">'; 
        }
else
    {
        return '<input type="checkbox"  name="SendEmail"  onClick="SendEmail_Clicked('+Id+')">'; 
    }
}));}

要调用SendEmail_Clicked，首先必须将其与调用函数绑定，否则无法正常工作

var dt = this;
dt.SendEmail_Clicked = SendEmail_Clicked;

有关详细信息，请you can read this