未捕获的类型错误：无法读取 JQuery DataTable 未定义的属性“mData”

Posted 2023-05-07

【中文标题】未捕获的类型错误：无法读取 JQuery DataTable 未定义的属性“mData”

【英文标题】：Uncaught TypeError: Cannot read property 'mData' of undefined for JQuery DataTable

【发布时间】：2016-04-10 08:54:54

【问题描述】：

我已将我的数据表绑定到我在 ASP.Net 中的网格视图。我尝试使用 jQuery dataTable 在我的 gridview 中显示搜索和排序选项，但数据表给我一个错误。

错误是： Uncaught TypeError: Cannot read property 'mData' of undefined" 这是错误。

我使用了以下代码：

function pageLoad(sender, args) 
    $('#grdProducts').DataTable(
        $(document).ready(function () 
            $('.dataTable').dataTable();
        )
    );

<asp:GridView ID="grdProducts" runat="server" AutoGenerateColumns="false" CssClass="table table-hover dataTable">
    <Columns>
         <asp:TemplateField Visible="false">
            <ItemTemplate>
                <asp:Label ID="lblProductID" runat="server"                        Text='<%# Eval("ProductID")%>' />
            </ItemTemplate>
        </asp:TemplateField>
        <%--<asp:BoundField DataField="GroupName" HeaderText="Group Name" />--%>
        <asp:BoundField DataField="BrandID" HeaderText="Brand" />
        <asp:BoundField DataField="ProductName" HeaderText="Product" />
        <asp:BoundField DataField="ShortCode" HeaderText="Code " />
        <asp:BoundField DataField="Price" HeaderText="Price" />
        <asp:TemplateField HeaderText="Update">
            <ItemTemplate>
                <asp:Button ID="btnUpdate" runat="server" Text="Update" class="btn btn-info" OnClick="btnUpdate_OnClick" />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

【参考方案1】：

默认情况下，ASP GridView 将所有内容保留在标记下，并且不会在 下呈现网格标题，这将导致“mData”错误。

为此，请在将数据绑定到 GridView 后使用以下行：

GridViewName.HeaderRow.TableSection = TableRowSection.TableHeader;

【讨论】：

我尝试过的所有东西，但这条线在我的 gridview 上对我有用。

【参考方案2】：

改用下面的代码：

$(document).ready(function ()
    $('#grdProducts').DataTable();
);

【讨论】：

我以前用过。使用它，我没有收到任何错误，但是我想要的搜索选项，gridview 中的排序选项确实来了。 $('#grdProducts').DataTable( $(document).ready(function () $('.dataTable').dataTable( "aoColumnDefs": [ 'bSortable': true, 'aTargets': [4 , 5, 6, 7] ] ); ));我添加了我在网上找到的这段代码。使用后我得到：未捕获的类型错误：无法设置未定义此错误的属性“_DT_CellIndex”。

@AtiburRahman 我遇到了Cannot set property '_DT_CellIndex' of undefined，因为我的插值表有一些columnspan <td>s！！！我的 DataTables 是 DOM 发起的（不是 javascript 或 AJAX 数据，而是 DOM 发起的）。也许这就是您遇到的问题，只是告诉您可能要花几个小时。

【参考方案3】：

  function pageLoad() 

  var table = $('#grdProducts').DataTable
  (
       //Here you can define other things using Var table
  );    
 

您可以在页面加载或行数据绑定时添加它

grdProducts.UseAccessibleHeader = true;
//adds <thead> and <tbody> elements
grdProducts.HeaderRow.TableSection =
TableRowSection.TableHeader;