bootstrap-table-examples
bootstrap-table-examples copied to clipboard
Editable example on JS constructor
Hi!
If it possible to use Editable extension when my table constructed via JavaScript like
Example only show how to use it via <th data-editable:"true"></th>
$('#example-table').bootstrapTable({
columns: [
{title:"Days", field:"Days"},
{title:"Orig date", field:"TransactionDate"},
{title:"Last Activity", field:"ModifiedAfter"},
{title:"Category", field:"CategoryText"},
{title:"Desc", field:"Desc"},
{title:"Control", field:"Control"},
{title:"Vehicle Cost", field:"VehicleCost"},
{title:"Account", field:"Account" },
{title:"Involice", field:"Invoice"},
{title:"Curtailment", field:"Curtailment"},
{title:"Amount", field:"Amount"},
{title:"<div class='text-center'><i class='fa fa-filter' aria-htitleden='true'></i></div>", field:"Filtered", align: "center"},
{title:"Comment", field:"Comment", width:"25%"}
],
data: tabledata,
sortName: "Days",
sortOrder: "desc"
})
Thank you! Mike
@MikhailKlemin
<link href="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet"/>
<script src="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-editable/js/bootstrap-editable.min.js"></script>
<script src="/static/bootstrap-table/bootstrap-table-editable.js"></script>
Then in js constructor,:
columns: [
{field:'desc',sortable: true,title: 'Desc',
editable:{
type: 'text',
title: 'Desc',
validate: function (value) {
value = $.trim(value);
if (!value) {
return 'This field is required';
}
return '';
}
}},