带Bootstrap切换的数据表

Question

在datatable上使用引导程序切换时遇到问题。 在这里，我确实初始化了引导程序切换，就像在datatable的论坛Datatable Bootstrap Toggle Discussion上的演示中的讨论一样，它工作正常，但是当我尝试在自己的项目中实现它时，它就变成了这样的元素：

<div class="toggle btn btn-default off btn-mini" data-toggle="toggle" style="width: 60%; height: 0px;">
    <div class="toggle btn btn-default off btn-mini" data-toggle="toggle" style="width: 60%; height: 0px;">
        <input type="checkbox" class="toggle" data-toggle="toggle" name="status" req_code="PR 00012J" id="SJ 00012B">
        <div class="toggle-group">
            <label class="btn btn-primary btn-mini toggle-on">Received</label>
            <label class="btn btn-default btn-mini active toggle-off">Unreceived</label>
            <span class="toggle-handle btn btn-default btn-mini"></span>
        </div>
    </div>

    <div class="toggle-group">
        <label class="btn btn-primary btn-mini toggle-on">Received</label>
        <label class="btn btn-default btn-mini active toggle-off">Unreceived</label>
        <span class="toggle-handle btn btn-default btn-mini"></span>
    </div>
</div>

就像创建了两次元素...

这是我的数据表脚本：

var table = $('.dataTable').DataTable({
            "rowId": 'do_code',
            "paging": true,
            "lengthChange": true,
            "searching": true,
            "sDom":"ltipr",
            "ordering": true,
            columnDefs: [{
            orderable: false,
            targets: "no-sort"
            }],
            "info": true,
            "autoWidth": true,
            "ajax": BASE_URL+'spareparts/partDeliveryOrder/ajax_all',
            "fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
               var index = iDisplayIndex +1;
               $('td:eq(0)',nRow).html(index);

                $('.toggle',nRow).prop( 'checked', aData.do_isreceived == 1 ).bootstrapToggle({
                    width   : '60%',
                    size    : "mini",
                    on      : 'Received',
                    off     : 'Unreceived',
                });

               return nRow;
            },

            "columns":[
                {'data' : null},
                {'data' : "do_code"},
                {'data' : "request_code"},
                {'data' : "request_approve_code"},
                {'data' : "do_at"},
                {'data' : "fullname"},
                {'data' : "fullname2"},
                {'data' : "request_status"},
                {
                    'render' : function(data, type, row) {
                        btnAct = "";
                        btnDet = "";

                        btnDet = '<a class="btn btn-primary" href="'+BASE_URL+'spareparts/partDeliveryOrder/detail/'+row.encrypt_code+'"><i class="fa fa-eye"></i></a>';

                        if (row.request_to != myId)
                        {
                            btnAct = '<input type="checkbox" class="toggle" data-toggle="toggle" name="status" req_code="'+row.request_code+'" id="'+row.do_code+'" '+(row.do_isreceived == 1 ? "checked" : "")+'>';
                        }

                        return btnDet+"\n"+btnAct;
                    }   
                },
            ]
        });

该问题的任何解决方案吗？

谢谢！