bootstrap-table-examples icon indicating copy to clipboard operation
bootstrap-table-examples copied to clipboard

Editable example on JS constructor

Open MikhailKlemin opened this issue 8 years ago • 1 comments

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 avatar Dec 19 '16 19:12 MikhailKlemin

@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 '';
                    }
                }},

timestee avatar Oct 31 '17 03:10 timestee