我正在使用Datatables版本1.10.6。 在jquery.dataTables.js中,我遇到了错误。
0x800a138f - JavaScript运行时错误:无法获取未定义或空引用的属性“mData”。
$.each( _fnGetRowElements( oSettings, rowOne[0] ).cells, function (i, cell) {
var col = oSettings.aoColumns[i];
if ( col.mData === i ) {// this line gives error
var sort = a( cell, 'sort' ) || a( cell, 'order' );
var filter = a( cell, 'filter' ) || a( cell, 'search' );
if ( sort !== null || filter !== null ) {
col.mData = {
_: i+'.display',
sort: sort !== null ? i+'.@data-'+sort : undefined,
type: sort !== null ? i+'.@data-'+sort : undefined,
filter: filter !== null ? i+'.@data-'+filter : undefined
};
_fnColumnOptions( oSettings, i );
}
}
} );
}
在MVC我正在使用:
<script type="text/javascript">
$(document).ready(function () {
// Setup - add a text input to each footer cell
$('#example tfoot th').each(function () {
var title = $('#example thead th').eq($(this).index()).text();
$(this).html('<input type="text" placeholder="Search ' + title + '" />');
});
// DataTable
var table = $('#example').DataTable();
alert(table);
// Apply the search
table.columns().every(function () {
var that = this;
$('input', this.footer()).on('keyup change', function () {
that
.search(this.value)
.draw();
});
});
});
</script>
<table class="display" id="example" cellspacing="0">
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Email</th>
<th>Employee Id</th>
<th>Active</th>
<th>SFDC</th>
<th>System User</th>
</tr>
</thead>
<tfoot>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Email</th>
<th>Employee Id</th>
<th>Active</th>
<th>SFDC</th>
<th>System User</th>
</tr>
</tfoot>
<tbody>
@foreach (var item in Model)
{
<tr>
<td valign="middle" align="center">
@Html.DisplayFor(modelitem => item.FirstName)
</td>
<td valign="middle" align="center">
@Html.DisplayFor(modelitem => item.LastName)
</td>
<td valign="middle" align="center">
@Html.DisplayFor(modelitem => item.EmailAddress)
</td>
<td valign="middle" align="center">
@Html.DisplayFor(modelitem => item.EmployeeId)
</td>
<td valign="middle" align="center">
@Html.DisplayFor(modelitem => item.IsActive, true)
</td>
<td valign="middle" align="center">
@Html.DisplayFor(modelitem => item.IsSFDC, true)
</td>
<td valign="middle" align="center">
@Html.DisplayFor(modelitem => item.IsSystemUser, true)
</td>
<td valign="middle" align="center">
@Html.ActionLink(" ", "Edit", new { id = item.UserId }, new { @class = "edit_btn", title = "Edit" })
@Html.ActionLink(" ", "Details", new { id = item.UserId }, new { @class = "details", title = "Details" })
@Html.ActionLink(" ", "Delete", new { id = item.UserId }, new { @class = "delete", title = "Delete" })
</td>
</tr>
}
</tbody>
</table>
答案 0 :(得分:6)
标题列数不匹配导致此问题,标题列和行列应该相同。
答案 1 :(得分:2)
我添加了额外的<th></th>
八列缺失
<th>First Name</th>
<th>Last Name</th>
<th>Email</th>
<th>Employee Id</th>
<th>Active</th>
<th>SFDC</th>
<th>System User</th>
<th></th>
答案 2 :(得分:1)
当我收到此错误时,我尝试了上述解决方案,在查看网页上的源代码后,我看到表格的整个内部内容都在<tbody>
而不是<thead>
}和<tbody>
。因此,请确保您具有与每行中的单元格相同数量的标题列,如上所述:
<table>
<thead>
<tr>
<th></th>
...
<tr>
</thead>
<tbody>
<tr>
<td></td>
...
</tr>
</tbody>
</table>
在我这样做之后,它起作用了!
答案 3 :(得分:0)
我遇到了同样的情况。对于我的情况,由于表标记中的runat =“server”属性。
从表声明中删除了runat =“server”后,它运行良好。
答案 4 :(得分:0)
当附加到JQuery选择器的操作无法成功执行特定文档的元素时,也会发生这种情况。因此,您可以更改元素的ID或修复操作的JavaScript代码。