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>
我没有在代码中看到'$（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
我做到了，但它没有改变任何东西，仍然grttimg相同的错误 – 2015-04-05 01:53:30
Firefox控制台显示错误发生的文件名和行号，请你张贴吗？ – 2015-04-06 14:27:00