大家好我正在開發一個網站,並嘗試使用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