美文网首页
bootstrap table editable行内编辑sele

bootstrap table editable行内编辑sele

作者: Shinegalaxy | 来源:发表于2019-11-29 23:50 被阅读0次

把bootstrap-table-editable.js文件的,1355行

            column.formatter = function (value, row, index) {
              var result = Utils.calculateObjectValue(column, column._formatter, [value, row, index], value);
              result = typeof result === 'undefined' || result === null ? _this.options.undefinedText : result;
              $.each(column, processDataOptions);
              $.each(editableOptions, function (key, value) {
                editableDataMarkup.push(" ".concat(key, "=\"").concat(value, "\""));
              });
              var _dont_edit_formatter = false;

              if (column.editable.hasOwnProperty('noeditFormatter')) {
                _dont_edit_formatter = column.editable.noeditFormatter(value, row, index);
              }

              if (_dont_edit_formatter === false) {
                return "<a href=\"javascript:void(0)\"\n            data-name=\"".concat(column.field, "\"\n            data-pk=\"").concat(row[_this.options.idField], "\"\n            data-value=\"").concat(result, "\"\n            ").concat(editableDataMarkup.join(''), ">"+value+"</a>");
              }

              return _dont_edit_formatter;
            };

修改为:

column.formatter = function(value, row, index) {
                  var result = column._formatter ? column._formatter(value, row, index) : value;
                  $.each(column, processDataOptions);
                  $.each(editableOptions, function(key, value) {
                      editableDataMarkup.push(' ' + key + '="' + value + '"');
                  });
                  var _dont_edit_formatter = false;
                  if (column.editable.hasOwnProperty('noeditFormatter')) {
                      var process = column.editable.noeditFormatter(value, row, index);
                      if(!process.hasOwnProperty('class')){
                          process.class = '';
                      }
                      if(!process.hasOwnProperty('style')){
                          process.style = '';
                      }
                      _dont_edit_formatter = ['<a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" rel="external nofollow" ',
                          ' data-name="'+process.filed+'"',
                          ' data-pk="1"',
                          ' data-value="' + process.value + '"',
                          ' class="'+process.class+'" style="'+process.style+'"',
                          '>' + process.text+ '</a>'
                      ].join('');
                  }
                  if (_dont_edit_formatter === false) {
                      return ['<a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" rel="external nofollow" ',
                          ' data-name="' + column.field + '"',
                          ' data-pk="' + row[_this.options.idField] + '"',
                          ' data-value="' + result + '"',
                          editableDataMarkup.join(''),
                          '>' + value + '</a>'
                      ].join('');
                  } else {
                      return _dont_edit_formatter;
                  }
              };

并在行内editable中写一个函数noeditFormatter

                editable:{
                    type: 'select',
                    title: '部门',
                    source: users,
                    noeditFormatter: function (value,row,index) {
                        var zz
                        if(value!= null)
                            zz = value.username
                    var result={filed:"securityGuard",value:zz,class:"badge",style:"background:#333;padding:5px 10px;",text:'要显示的内容'};

                    return result;
                }

这样把数据更新完毕刷新就行了

相关文章

网友评论

      本文标题:bootstrap table editable行内编辑sele

      本文链接:https://www.haomeiwen.com/subject/rfpnwctx.html