Question

要求：在表格中动态创建无线电引导开关。

参考：我正在尝试实现此链接中给出的无线电自举开关 - http://www.bootstrap-switch.org/#radio-javascript

我必须动态地创建它。所以我通过更改上面链接中给出的“创建”示例代码来尝试它

js和css文件的链接是 - https://github.com/BdMdesigN/bootstrap-switch/tree/master/static

问题描述：能够创建自举开关但无法处理单选按钮功能选择同一组中的一个开关

我的代码：

<table class="table table-bordered table-hover" id="main_table">
<thead>
<tr>
<th>Role Name</th>
<th>Status</th>
</tr>
</thead>
<tbody></tbody></table>

在create function中我添加了以下代码来为表创建无线电开关：

$('#btn-create').on('click', function () {          
        mainTable.fnAddData([
        'Role1',
        ' <input id="Role1" type="radio" name="mainTableRadio" checked >',
        '1'
        ]);
        $('#Role1').wrap('<div class="make-switch mainTableRadio"  />').parent().bootstrapSwitch();
         mainPolicyTable.fnAddData([
        'Role2',
        ' <input id="Role2" type="radio" name="mainTableRadio"  >',
        '1'
        ]);
        $('#Role2').wrap('<div class="make-switch mainTableRadio"  />').parent().bootstrapSwitch();
        $(this).remove()
    });
    $('.mainTableRadio').on('switch-change', function () {
        console.log("inside switchchange");
        $(' .make-switch.mainTableRadio').bootstrapSwitch('toggleRadioStateAllowUncheck', false);
    });

我也无法在开关的开关更改功能中打印日志

Answer 1

我通过在'btn-create'点击事件中添加'switch-change'功能解决了这个问题。

动态创建一个无线电引导开关

1 个答案: