2015-04-04 46 views
1

大家好我正在開發一個網站,並嘗試使用jQuery的DataTable我得到的FF控制檯上的錯誤:類型錯誤:設置爲nulljQuery的數據表錯誤:類型錯誤:設置爲null

$(設置。 nTable).trigger(e +'。dt',args); 服務器代碼工作很好,我回來JSON格式,看起來像這樣的數據:

{"data":[ {"id": 11, 
"Name": "Matthieu Bailly", 
"unitsBet": 650.46700023859739, 
"UnitsWon": -4.8294003307819366 } 
,{"id": 18,"Name": "Niki Dosev", 
"unitsBet": 675.54000033438206, 
"UnitsWon": -22.710001260042191 }]} 

這是我的HTML/JS代碼

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>My Members Stats</title> 
<meta name="viewport" content="initial-scale=1.0, maximum-scale=2.0"> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" /> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css" /> 
<link href="../CSS/PunteamCSS.css" rel="stylesheet" /> 
<link href="http://31.168.155.52/ASP/css/main.css" rel="stylesheet" /> 
<!-- JQUERY DataTable CSS--> 
<link href="../DataTable/media/css/jquery.dataTables.min.css" rel="stylesheet" /> 
<link href="../DataTable/resources/syntax/shCore.css" rel="stylesheet" /> 
<link href="../DataTable/resources/demo.css" rel="stylesheet" /> 
<style type="text/css" class="init"> 
    td.details-control { 
     background: url('../resources/details_open.png') no-repeat center center; 
     cursor: pointer; 
    } 

    tr.shown td.details-control { 
     background: url('../resources/details_close.png') no-repeat center center; 
    } 
</style> 
<!-- END JQUERY DataTable CSS--> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.24/jquery-ui.min.js"></script> 
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script> 
<!-- DataTable JS--> 
<script src="../DataTable/js/jquery.dataTables.js"></script> 
<script src="../DataTable/js/jquery.dataTables.min.js"></script> 
<script src="../DataTable/resources/syntax/shCore.js"></script> 
<script src="../DataTable/resources/demo.js"></script> 

<script src="../PunteamScripts/AddAffiliate.js"></script> 
<script src="../PunteamScripts/PunteamGlobals.js"></script> 
<script src="../PunteamScripts/general.js"></script> 
<script type="text/javascript" language="javascript" class="init"> 

    var ID = ''; //Global parameter for Loged in user 

    //************************************************************************** 
    //** Jquery Ready function hooks the buttons click events     * 
    //************************************************************************** 
    $() 
    $(document).ready(function() { 
     //Load the top and bottum HTML 
     $("#top").load("../HTML-Includes/top.html"); 
     $("#bottum").load("../HTML-Includes/bottum.html"); 
     // Ajax params Setup 
     $.ajaxSetup({ 
      url: serverAddress, 
      type: "POST" 
     }); 
     // get parameters from ASP page 
     var queries = {}; 
     $.each(document.location.search.substr(1).split('?'), function (c, q) { 
      var i = q.split('='); 
      ID = i[1].toString(); 
      AffiliateMembersStats.pType = "GetAffiliateMembersStats" 
      AffiliateMembersStats.data[0].affilateId = ID 
     }); 
     // Call to server to get Recommender detailes (Loged in user) 
     $.ajax({ 
      type: "POST", 
      processData: false, 
      data: JSON.stringify({ json: AffiliateMembersStats }), 
      // dataType: "json", 
      success: function (data) { 

       var table = $('#membersStats').DataTable({ 
        "data": data, 
        "columns": [ 
         { 
          "className": 'details-control', 
          "orderable": false, 
          "data": null, 
          "defaultContent": '' 
         }, 
         { "data": "Name" }, 
         { "data": "unitsBet" }, 
         { "data": "UnitsWon" }, 
        ], 
        "order": [[1, 'asc']] 
       }); 
      }, 
      failure: function (errMsg) { 
       alert("Error in Get Members Stats"); 
      } 
     }); 
     //End get parameter 


     // Add event listener for opening and closing details 
     $('#membersStats tbody').on('click', 'td.details-control', function() { 
      var tr = $(this).closest('tr'); 
      var row = table.row(tr); 

      if (row.child.isShown()) { 
       // This row is already open - close it 
       row.child.hide(); 
       tr.removeClass('shown'); 
      } 
      else { 
       // Open this row 
       row.child(format(row.data())).show(); 
       tr.addClass('shown'); 
      } 
     }); 
    }); 
    //************************************************************* 
    //* Formatting function for row details - modify as you need ** 
    //************************************************************* 
    function format(data) { 
     // `data` is the original data object for the row 
     return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">' + 
      '<tr>' + 
       '<td>Full name:</td>' + 
       '<td>' + data.Name + '</td>' + 
      '</tr>' + 

      '<tr>' + 
       '<td>Extra info:</td>' + 
       '<td>And any further details here (images etc)...</td>' + 
      '</tr>' + 
     '</table>'; 
    } 
</script> 
<!--//******************* End Of Script Blosk *******************--> 
</head> 
<body> 
<div id="top" class="col-md-12"></div> 
<div class="container body-content" align="center" style="width:1200px; padding: 0 0 0 0;"> 
    <div id="top" class="col-md-12"> 
     <table id="membersStats" class="display" cellspacing="0" width="100%"> 
      <thead> 
       <tr> 
        <th></th> 
        <th>Name</th> 
        <th>Units Bets</th> 
        <th>Units Won</th> 
       </tr> 
      </thead> 
     </table> 
    </div> 
</div> 
<div id="bottum" class="col-md-12">></div> 

+0

我沒有在代碼中看到'$(settings.nTable).trigger(e +'。dt',args)'調用的任何引用。看起來你只包含僅用於DataTables示例的JS/CSS文件。請刪除對shCore.css/shCore.js和demo.css/demo.js的引用,看看是否解決了這個問題。同時刪除對「jquery.dataTables.js」的引用,因爲您已經包括縮小版本「jquery.dataTables.min.js」。 – 2015-04-04 19:57:35

+0

我做到了,但它沒有改變任何東西,仍然grttimg相同的錯誤 – 2015-04-05 01:53:30

+0

Firefox控制檯顯示錯誤發生的文件名和行號,請​​你張貼嗎? – 2015-04-06 14:27:00

回答

3

我已經得到了同樣的問題,並且似乎在5070行(我正在使用v.1.10.7)進行了違規呼叫:

_fnCallbackFire(settings, null, 'error', [ settings, tn, msg ]); 

進而引起「完整性檢查上線6111:

/* Sanity check */ 
if (this.nodeName.toLowerCase() != 'table') 
{ 
    _fnLog(null, 0, 'Non-table node initialisation ('+this.nodeName+')', 2); 
    return; 
} 

在我的情況節點名稱是‘DIV’,因爲我錯誤地分配數據表ID周圍表中的DIV。

+0

_in我的情況nodeName是「DIV」,因爲我錯誤地將DataTable ID分配給了圍繞該表的DIV._ < - 這個。 – 2015-09-10 14:37:56

0

確保您沒有將tableid放入另一個tag的內部。在我的情況下,我有<div id='myDataTable'><table></table></div>而不是<div><table id='myDataTable'></table></div>