Bootstrap 开关类不适用于复选框输入?

伊夫蒂哈尔乌丁

我正在尝试在复选框输入上应用引导开关功能,但引导开关类不适用于我的复选框输入。

用于渲染引导开关类的 JS:

cx.common.admin.tableSwitchableColumn('status', {
    editable: true,
    createdCell: function (td, cellData, rowData, row, col){
        $(td).data('status-id', rowData.id);
    },
    onText: 'Enable',
    offText: 'Disable'
})

上述代码的渲染 HTML 输出:

<td class=" text-center">
    <input class="bootstrapSwitch" data-on-color="success" data-on-text="Enable" data-off-text="Disable" data-size="mini" type="checkbox" checked="">
</td>

用户界面输出:

可切换输出

tableSwitchableColumn 基本功能:

// Function that render a Switchable column e.g Yes/No
cx.common.admin.tableSwitchableColumn = function(columnName, options){
    // Extend default options with specified options (if any)
    options = $.extend({
        editable: false,
        createdCell: null,
        dateEvaluatedAsYes: function(data){
            return data === '1' || data == 1;
        },
        onText: 'Yes',
        offText: 'No'
    }, cx.common.getValueOrDefault(options, {}));
    // Build the column settings object
    var columnSettings = {
        data: columnName,
        width: '25px',
        render: function(data){
            var checkedAttribute = options.dateEvaluatedAsYes(data) ? ' checked' : '';
            var disabledAttribute = options.editable ? '' : ' disabled';
            return '<input class="bootstrapSwitch" data-on-color="success" data-on-text="' + options.onText + '" data-off-text="'+ options.offText + '" data-size="mini" type="checkbox"' + checkedAttribute + disabledAttribute + '>';
        },
        className: 'text-center'
    };
    // If specified in the options, set the celle created callback
    if(options.createdCell !== null)
        columnSettings.createdCell = options.createdCell;
    // Return the column settings
    return columnSettings;
}

使用的版本:

Bootstrap v3.4.1、Bootstrap switch v3.3.4

伊夫蒂哈尔乌丁

我在我的页面中添加了以下代码并开始工作

setInterval(function(){$('.bootstrapSwitch').bootstrapSwitch();}, 2000);

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章