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属性即可实现。但该方法要刷新页面重载后才能有效。
  • 相关阅读:
    adb shell am pm 用法
    HTML的属性和css基础
    HTML的实际演练2
    HTML的实际演练1
    HTML的标签简介
    HTML的基础知识
    Python之 ---成员修饰符
    Python基础之-----------函数
    Python之-------基础数据类型
    Python之内置函数
  • 原文地址:https://www.cnblogs.com/ms_senda/p/12095945.html
Copyright © 2011-2022 走看看