boostrap-table行内编辑官方推荐解决方案bootstrap-table-editable、bootstrap-editable

发布时间:2020-07-24 15:21:04 作者:Mos 阅读量:1380

效果预览:

文档地址:

插件bootstrap-table-editable官方文档:

https://examples.bootstrap-table.com/#extensions/editable.html

中文:https://www.bootstrap-table.com.cn/doc/extensions/editable

插件x-editable官方文档

http://vitalets.github.io/x-editable/docs.html#editable

部分代码参考:

      clickEdit: true,
      columns: [{
        checkbox: true
      },
        {
          title: "名称",
          field: "name",
          editable: {
            type: 'text',
            escape: false,
            title: '名称',
            validate: function (v) {
              if (!v) {
                return '名称不能为空';
              }
            }
          }
        },
        {
          title: "月数",
          field: "expireMonth",
          editable: {
            type: 'text',
            escape: false,
            title: '月数',
            validate: function (v) {
              if (v) {
                if (isNaN(v)) return '月数必须是数字';
              }
            }
          }
        },
        {
          title: "价格",
          field: "price",
          editable: {
            type: 'text',
            escape: false,
            title: '价格',
            validate: function (v) {
              if (!v) return '价格不能为空';
              if (isNaN(v)) return '价格必须是数字';
            }
          }
        },
        {
          title: "状态",
          field: "status",
          editable: {
            type: 'select',
            title: '状态',
            source: [{"value":1,"text":"启用"},{"value":0,"text":"禁用"}],
            inputclass:"tableselect",
            validate: function (v) {
              if (!v) {
                return '状态必选';
              }
            }
          }
        },
      ]


转载请注明出处:文思齐远博客,如果对您有帮助,请帮忙点一下右侧的广告,谢谢您了!
支付宝打赏 微信打赏

我要评论

猜你想搜

实时天气

©2020 i847.cn
部分内容转自网络,如有损害您的权益,致邮联系:jiang2008wen#126.com,一经证实,立即删除!    我要留言
备案号:蜀ICP备18020563号-1