错误码：Uncaught TypeError: Cannot read property 'field' of undefined

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/u014490083/article/details/79597425

错误码：Uncaught TypeError: Cannot read property ‘field’ of undefined

具体错误信息：

Uncaught TypeError: Cannot read property 'field' of undefined
    at HTMLTableCellElement.<anonymous> (bootstrap-table.js:506)
    at Function.each (jquery-1.11.3.min.js:2)
    at m.fn.init.each (jquery-1.11.3.min.js:2)
    at HTMLTableRowElement.<anonymous> (bootstrap-table.js:505)
    at Function.each (jquery-1.11.3.min.js:2)
    at m.fn.init.each (jquery-1.11.3.min.js:2)
    at BootstrapTable.initTable (bootstrap-table.js:497)
    at BootstrapTable.init (bootstrap-table.js:414)
    at new BootstrapTable (bootstrap-table.js:165)
    at HTMLTableElement.<anonymous> (bootstrap-table.js:2281)

错误源代码

<table id="table" data-toggle="table">
    <tr>
        <th class="number title-cell">序号</th>
        <th class="name title-cell">产品名称</th>
        <th class="kind title-cell">产品种类</th>
        <th class="bank title-cell">银行名称</th>
        <th class="custorm title-cell">客户属性</th>
        <th class="rate title-cell">利率</th>
        <th class="year title-cell">贷款年限</th>
        <th class="money title-cell">贷款额度</th>
        <th class="attribute title-cell">属性列表</th>
        <th class="sort title-cell">排序</th>
        <th class="operate title-cell">操作</th>
    </tr>
</table>

修改后代码

<table id="table" data-toggle="table">
    <thead>
        <tr>
            <th class="number title-cell">序号</th>
            <th class="name title-cell">产品名称</th>
            <th class="kind title-cell">产品种类</th>
            <th class="bank title-cell">银行名称</th>
            <th class="custorm title-cell">客户属性</th>
            <th class="rate title-cell">利率</th>
            <th class="year title-cell">贷款年限</th>
            <th class="money title-cell">贷款额度</th>
            <th class="attribute title-cell">属性列表</th>
            <th class="sort title-cell">排序</th>
            <th class="operate title-cell">操作</th>
        </tr>
    </thead>
</table>

原因

1. 缺少<thead>；
2. 在表格里的<td>标签数量与<th>的标签数量不一样。

解决方法

1. 确保表格里有<thead>标签；
2. 确保表格里的<td>数量与<th>数量一致。

参考连接

1. https://www.gyrocode.com/articles/jquery-datatables-common-javascript-console-errors/#typeerror-cannot-read-property-mdata-of-undefined
2. https://datatables.net/manual/installation#HTML