[Jquery] 數據表:無法讀取未定義的屬性'mData'


Answers

Cannot read property 'fnSetData' of undefined常見原因是列數不匹配,就像在這個錯誤的代碼中一樣:

<thead>                 <!-- thead required -->
    <tr>                <!-- tr required -->
        <th>Rep</th>    <!-- td instead of th will also work -->
        <th>Titel</th>
                        <!-- th missing here -->
    </tr>
</thead>
<tbody>
    <tr>
        <td>Rep</td>
        <td>Titel</td>
        <td>Missing corresponding th</td>
    </tr>
</tbody>

儘管下面的代碼帶有一個<th> per <td> (列數必須匹配):

<thead>
    <tr>
        <th>Rep</th>       <!-- 1st column -->
        <th>Titel</th>     <!-- 2nd column -->
        <th>Added th</th>  <!-- 3rd column; th added here -->
    </tr>
</thead>
<tbody>
    <tr>
        <td>Rep</td>             <!-- 1st column -->
        <td>Titel</td>           <!-- 2nd column -->
        <td>th now present</td>  <!-- 3rd column -->
    </tr>
</tbody>

當使用一個格式良好但沒有第二行的thead時,該錯誤也會出現。

對於有7列的表格,以下內容不起作用,我們在javascript控制台中看到“無法讀取未定義的屬性'mData':

<thead>
    <tr>
        <th>Rep</th>
        <th>Titel</th>
        <th colspan="5">Download</th>
    </tr>
</thead>

雖然這工作:

<thead>
    <tr>
        <th rowspan="2">Rep</th>
        <th rowspan="2">Titel</th>
        <th colspan="5">Download</th>
    </tr>
    <tr>
        <th>pdf</th>
        <th>nwc</th>
        <th>nwctxt</th>
        <th>mid</th>
        <th>xml</th>
    </tr>
</thead>
Question

Datatables有問題。 我也通過這個鏈接 ,沒有得到任何結果。我已經介紹了將數據直接解析到DOM中的所有先決條件。 請幫我解決這個問題。

腳本

$(document).ready(function() {
  $('.viewCentricPage .teamCentric').dataTable({
    "bJQueryUI": true,
    "sPaginationType": "full_numbers",
    "bPaginate": false,
    "bFilter": true,
    "bSort": true,
    "aaSorting": [
      [1, "asc"]
    ],
    "aoColumnDefs": [{
      "bSortable": false,
      "aTargets": [0]
    }, {
      "bSortable": true,
      "aTargets": [1]
    }, {
      "bSortable": false,
      "aTargets": [2]
    }],
  });
});



我找到了一些“解決方案”。

此代碼不起作用:

<table>
<thead>
    <tr>
        <th colspan="3">Test</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>
</tbody>

但這是好的:

<table>
<thead>
    <tr>
        <th colspan="2">Test</th>
        <th></th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>
</tbody>

我想,問題是,最後一個TH不能有屬性colspan。




如果您有像'aoColumns':[..]這樣'aoColumns':[..]表參數'aoColumns':[..] ,它們與正確的列數不匹配,也會發生這種情況。 當從其他頁面複製粘貼代碼以快速啟動數據表集成時,通常會出現這樣的問題。

例:

這不會起作用:

<table id="dtable">
    <thead>
        <tr>
            <th>col 1</th>
            <th>col 2</th>
        </tr>
    </thead>
    <tbody>
        <td>data 1</td>
        <td>data 2</td>
    </tbody>
</table>
<script>
        var dTable = $('#dtable');
        dTable.DataTable({
            'order': [[ 1, 'desc' ]],
            'aoColumns': [
                null,
                null,
                null,
                null,
                null,
                null,
                {
                    'bSortable': false
                }
            ]
        });
</script>

但是這會起作用:

<table id="dtable">
    <thead>
        <tr>
            <th>col 1</th>
            <th>col 2</th>
        </tr>
    </thead>
    <tbody>
        <td>data 1</td>
        <td>data 2</td>
    </tbody>
</table>
<script>
        var dTable = $('#dtable');
        dTable.DataTable({
            'order': [[ 0, 'desc' ]],
            'aoColumns': [
                null,
                {
                    'bSortable': false
                }
            ]
        });
</script>



在我的情況下,如果我使用沒有標題的表格,則會發生此錯誤

              <thead>
                   <tr>
                       <th>example</th>
                  </tr>
              </thead>



在我的情況下,使用ASP.NET GridView,UpdatePanel和DropDownList(帶有選擇插件,我使用Javascript行將值重置為零),我得到了這個錯誤,並嘗試了幾天沒有希望的一切。 問題是我的代碼落後的代碼如下,當我選擇一個值兩次將其操作應用於選定的網格行時,我得到該錯誤。 我想了好幾天這是一個Javascript問題(在我的情況下,再次),最後修復程序將更新過程中的drowpdown值設為零:

  private void ddlTasks_SelectedIndexChanged(object sender, System.EventArgs e)
  {
     if (ddlTasks.SelectedValue != 0) {
        ChangeStatus(ddlTasks.SelectedValue);
        ddlTasks.SelectedValue = "0"; //// **This fixed my issue**
     }

     dvItemsGrid.DataSource = CreateDatasource();
     dvItemsGrid.DataBind();
     dvItemsGrid.UseAccessibleHeader = true;
     dvItemsGrid.HeaderRow.TableSection = TableRowSection.TableHeader;

  }

這是我的錯:

     $('#<%= DropDownList.ClientID%>').val('0').trigger("chosen:updated").chosen();



除了不一致和數字之外,數據表腳本列部分中的缺失項也可能導致這種情況。 正在修復我的數據表搜索欄。

我正在談論這部分;

"columns": [
  null,
  .
  .
  .
  null
           ],

我一直在努力解決這個錯誤,直到我指出這部分比我的總數少了一個“零”。