zoukankan      html  css  js  c++  java
  • bootstrap-table-editable 实现表格行编辑

    https://bootstrap-table.com
    http://github.com/vitalets/x-editable

    $("#table").bootstrapTable({ url: "", editable: true, columns: [ { title: that.columns['Operate'], field: '_', align: 'center', }, { title: that.columns['x1'], field: 'x1', align: 'center', editable: { canEdit: true, type: 'number', validate: function (v) { if (v.length > 9) { return "数字超出范围"; } } }, cellStyle: function (value, row, index) { if (value == undefined || value == "" || isNaN(value)) { return { css: { "background-color": "yellow" } } } else { return { css: { "background-color": "white" } } } }, formatter: function (value, row, index) { if (value == null || value == 'NaN') { return ""; } else { return value; } } }]

    这里要注意一点
    canEdit: true  是修改原代码增加的属性,因为原代码判断 editable 属性存在就认为可编辑,与需求有一定出入。因此在原代码

    $.each(this.columns, function(i, column) {
    if (!column.editable) {
    return;
    }

    if (!column.editable.canEdit) {
    return;
    } 增加如下代码  

    table.options.editable 属性标识整行是否可以编辑,如果要实现列编辑动态锁定,更改canEdit属性即可实现。但该方法要刷新页面重载后才能有效。
  • 相关阅读:
    TyporaRecord
    c# 串口 应答式顺序下发命令 循环 间隔发送指令
    WPF 如何在单独的配置文件中使用Log4net
    UWP VisualStateManager
    USB通信
    UWP RelativePanel
    JSON 序列化与反序列化
    Unity 依赖注入的三种常用模板
    IOC Unity容器的基本使用
    使用EF完成基于SQLite的CodeFirst
  • 原文地址:https://www.cnblogs.com/ms_senda/p/12095945.html
Copyright © 2011-2022 走看看