为什么我的 Bootstrap-Editable with Bootstrap-tables 不起作用?
Why is my Bootstrap-Editable with Bootstrap-tables not working?
我正在创建一个需要 editable 字段的 table..
此 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);
在此之后,调用 bootstrap 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
});
table 绘制正确,但字段不是 editable。我可以在构建 table 之后调用 $('.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/
糟糕。事实证明,x-editable、bootstrap 3 和 bootstrap-tables 存在兼容性问题。
要解决此问题,我只需添加 bootstrap-editable-tables
扩展程序
https://github.com/wenzhixin/bootstrap-table/tree/master/src/extensions/editable
我正在创建一个需要 editable 字段的 table..
此 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);
在此之后,调用 bootstrap 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
});
table 绘制正确,但字段不是 editable。我可以在构建 table 之后调用 $('.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/
糟糕。事实证明,x-editable、bootstrap 3 和 bootstrap-tables 存在兼容性问题。
要解决此问题,我只需添加 bootstrap-editable-tables
扩展程序
https://github.com/wenzhixin/bootstrap-table/tree/master/src/extensions/editable