bootstrap-table 无法设置未定义的属性 'undefined'

Question

bootstrap-table version:1.16.0

目标：我想实现tableselect全部和多重的效果

代码：

<table class="table table-bordered" id="order-table">
  <thead>
      <tr>
        <th><input type="checkbox" id="btSelectAll" name="btSelectAll" /></th>
        <th>name1</th>
        <th>name2</th>
      </tr>
  </thead>
  <tbody>
    <tr>
      <td><input type="checkbox" name="btSelectItem" data-index="586"/></td>
      <td>val1</td>
      <td>val2</td>
    </tr>
    <tr>
      <td><input type="checkbox" name="btSelectItem" data-index="586"/></td>
      <td>val1</td>
      <td>val2</td>
    </tr>            
  </tbody>
</table>

<script type="text/javascript">
  $(function() {
    $table = $('#order-table').bootstrapTable({
      search: false,
      showColumns: false,
      multipleSelectRow: true
    });

  });
</script>

然后我点击复选框，触发错误

问题：控制台出错

bootstrap-table.min.js:10 Uncaught TypeError: Cannot set property 'undefined' of undefined
    at e.value (bootstrap-table.min.js:10)
    at HTMLInputElement.<anonymous> (bootstrap-table.min.js:10)
    at HTMLInputElement.dispatch (jquery.min.js:2)
    at HTMLInputElement.v.handle (jquery.min.js:2)
value   @   bootstrap-table.min.js:10
(anonymous) @   bootstrap-table.min.js:10
dispatch    @   jquery.min.js:2
v.handle    @   jquery.min.js:2

谁能告诉我为什么会这样以及如何解决。或者给我正确的例子？

Answer 1

问题出在您的属性 data-index

你不应该随机使用 data-index 作为支票簿 check/uncheck bootstrap-table 获取特定索引的行

看到这个fiddle，这个fiddle不会报错

 https://jsfiddle.net/jdvLbwc3/1/

此外，如果您想在 td 中使用 chcekbox，那么您应该使用 data-checkbox 属性，如此 link https://examples.bootstrap-table.com/#column-options/checkbox.html#view-source

Fiddle 使用 data-checkbox 属性 https://jsfiddle.net/jdvLbwc3/3/

$(function() {
  $table = $('#order-table').bootstrapTable({
    search: false,
    showColumns: false
  });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src=https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.16.0/bootstrap-table.min.js></script>
<table class="table table-bordered" id="order-table">
  <thead>
    <tr>
      <th data-checkbox="true"></th>
      <th>name1</th>
      <th>name2</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td data-checkbox="true"></td>
      <td>val1</td>
      <td>val2</td>
    </tr>
    <tr>
      <td data-checkbox="true"></td>
      <td>val1</td>
      <td>val2</td>
    </tr>
  </tbody>
</table>

bootstrap-table 无法设置未定义的属性 'undefined'

bootstrap-table Cannot set property 'undefined' of undefined

javascript

twitter-bootstrap

bootstrap-table

bootstrap-table 无法设置未定义的 属性 'undefined'

bootstrap-table Cannot set property 'undefined' of undefined

javascript

twitter-bootstrap

bootstrap-table

bootstrap-table 无法设置未定义的属性 'undefined'