【问题标题】:Why is my Bootstrap-Editable with Bootstrap-tables not working?为什么我的 Bootstrap-Editable 与 Bootstrap-tables 不起作用?
【发布时间】:2016-05-25 14:15:43
【问题描述】:

我正在创建一个需要可编辑字段的表格..

这个 jquery 元素被附加到页面:

var container = $('#up-modal .modal-body');
var table = $('<table></table>');
table.attr('id','up-table');
table.attr('style','width:auto;');
table.attr('data-toggle', 'table');
table.attr('data-search', 'true');
table.attr('data-maintain-selected', 'true');
table.attr('data-pagination','true');
table.attr('data-page-size',3);
container.append(table);

接着,调用引导表函数

$("#up-table").bootstrapTable({
    columns:[
        {
            field: 'id',
            title: 'ID',
            align: 'center'
        },
        {
            field: 'Permission',
            title: 'Permission',
            searchable: true
        },
        {
            field: 'Extended',
            name: 'Extended',
            title: 'Properties',
            editable:{
                type: 'text',
                pk: 1,
                title: 'Modify Properties',
                name: 'Extended',
                validate: function(value){
                    value = $.trim(value);
                    try{
                        JSON.parse(value);
                    }catch(e){
                        return 'Invalid json provided for properties';
                    }
                }
            }
        },
        {
            field: 'Access',
            title: 'Access',
            checkbox:true
        }
    ],
    data: tableData
});

表格绘制正确,但字段不可编辑。我可以在建表后调用$('.editable').editable(options) 并且工作正常,但是在涉及分页时它会停止工作。

我以这个例子作为参考https://github.com/wenzhixin/bootstrap-table-examples/blob/master/welcome.html

哦,我应该提到正确的脚本和 css 文件在本地托管并正确包含在我的 html 中。

库快速链接:
https://vitalets.github.io/bootstrap-editable/
http://bootstrap-table.wenzhixin.net.cn/

【问题讨论】:

    标签: javascript x-editable bootstrap-table


    【解决方案1】:

    哎呀。事实证明,x-editable、bootstrap 3 和 bootstrap-tables 存在兼容性问题。

    要解决这个问题,我只需添加 bootstrap-editable-tables 扩展名

    https://github.com/wenzhixin/bootstrap-table/tree/master/src/extensions/editable

    【讨论】:

    • 我遇到了同样的问题,但是当我包含上述库时,我得到了一个类继承 jQuery.BootstrapTable 不是对象或 null
    猜你喜欢
    • 1970-01-01
    • 2015-07-15
    • 1970-01-01
    • 2021-11-24
    • 2021-10-06
    • 1970-01-01
    • 2021-11-19
    • 2017-01-22
    • 2022-11-13
    相关资源
    最近更新 更多