DataTables warning(table id='edetails'): Requested Unknown Parameter...

Posted on 2015-01-16
Last Modified: 2015-01-16
This problem continues to haunt me.

This app went LIVE yesterday and immediately ran into the following error:
DataTables warning(table id='edetails'): Requested Unknown Parameter '7' from the data source for row 0"

To my dismay, we discovered that a great number of our users are still using IE8 and are refusing to upgrade to atleast  IE9.

So, IE is causing this error.

It turns out that IE11 was having the same issue. However, when I targeted the mode to edge, that is  

Anybody knows what that error is and how to resolve?

 <script type="text/javascript" charset="utf-8">
$(document).ready(function() {
    /* Init DataTables */
$("#edetails").dataTable( {
	"sProcessing" : true,
"sJQueryUI": true,
"aaSorting": [[ 1, "desc" ]],
"sPaginationType": "full_numbers",
"sDom": 'T<"clear"><"fg-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix"lfr>t<"fg-toolbar ui-widget-header ui-corner-bl ui-corner-br ui-helper-clearfix"ip>',
    "sAjaxSource" : "phpservices/getUserDeptRequests.php?loginName=<?php echo $user; ?>",
    "sAjaxDataProp" : "",
    "sDestroy" : false,
        "sScrollXInner": "110%",
    "fnServerData" : function(sSource, aoData, fnCallback) {
        request = $.ajax({
            "dataType" : "json",
            "type" : "GET",
            "url" : sSource,
            "data" : aoData,
            "success" : fnCallback
         "aoColumns" : [

         { "mDataProp": "RequestID", "sWidth": "50px", sSortable: true,
           "bSearchable": false,
           "bSortable": false,
           "fnRender": function (oObj)
             // oObj.aData[0] returns the RequestID
    return "<a target='tab' data-tab-name='#RequestDetails' data-tab-index='1' href='phpservices/getRequestDetails.php?loginName="
    + <?php echo json_encode($user); ?> + "&requestID=" + oObj.aData["RequestID"] + "'> " + oObj.aData["RequestID"] + " </a>";

          { mDataProp: "RequestDate",  "sWidth": "100px", sSortable: true },
          { mDataProp: "RequestorFullName",  "sWidth": "150px", sSortable: true },
          { mDataProp: "PrimarySiteContactDisplay",  "sWidth": "250px", sSortable: true },
          { mDataProp: "RequestLocation",  "sWidth": "150px", sSortable: true },
          { mDataProp: "RequestDescription",  "sWidth": "200px", sSortable: true },
          { mDataProp: "RequestStatus",  "sWidth": "100px", sSortable: true },

$('#cityworks tbody tr').click(function () {
    if ($(this).hasClass('selected')) $(this).removeClass('selected');
  $(window).bind('resize', function () {
   jQuery('.dataTable').wrap('<div class="scrollStyle" />');

$("#cityworks").on("click", "a[target='tab']", function(){
    var me = $(this);
    var url = me.attr("href");
    var tabName ="tabName");
    var tabIndex = parseInt("tabIndex"), 10);

    $.get(url, function(data) {
         $.each(data[0], function (key, value) {
             $("#tableRequestSummary td[name='" + key + "']").html(value);
             $("#divResultsMain td[name='" + key + "']").html(value);
             $("#tableRelatedWorkActivity td[name='" + key + "']").html(value);


 //   $(tabName).html(table2).append('<br>').append(table);
    $("table#details tr:even").css("background-color", "#eeeeee");
    $("table#details tr:odd").css("background-color", "#C0C0C0");
     // Activate the tab once the page has loaded:
     $("#tabs").tabs("option", "active", tabIndex);
     }, 'json');
      // Prevent the browser from following the link:
     return false;

<style type="text/css">
 #cityworks {
 border-collapse: separate;
table.details {
	border: 2px inset #8B8378;
	-moz-border-radius: 2px;
		font-size: 12px;
		text-align: left;
table.details td {
	border: 1px solid black;
	padding: 0.2em 2ex 0.2em 2ex;
	font-size: 12px;
	color: black;
table.details tr.d0 td {
	background-color: #eeeeee;
		font-size: 12px;
table.details tr.d1 td {
	background-color: #FEFEF2;
		font-size: 12px;
<script type="text/javascript">
  $("table#details tr:even").css("background-color", "red");
  $("table#details tr:odd").css("background-color", "blue");
<div class="fg-toolbar ui-widget-header ui-corner-all ui-helper-clearfix">
<div class="fg-buttonset ui-helper-clearfix">
<div id="TableToolsToolbar" class="fg-buttonset ui-helper-clearfix"> </div>
<table cellpadding="0" cellspacing="0" border="0" style="width:100%;" class="display" id="cityworks">
<thead style="background-color:#666362; color:White; font-weight:bold;font-size:10pt;">
<tr style="border:solid 1px #000000;">
	<th>Site Contact</th>
<style type="text/css">
table.dataTable tr.odd { background-color: #eeeeee;font-size:8pt; }
table.dataTable tr.even { background-color: white;font-size:8pt; }
div.dataTables_scroll { clear: both; }
.dataTables_length { vertical-align:middle;nowrap }
.dataTables_filter { vertical-align:middle;nowrap; }
	<style type="text/css">
		.divResultsSummary table {border:1px gray solid;}
		.divResultsRelatedWorkActivity table {border:1px gray solid;}
<style type="text/css">
tr.d0 td {
	background-color: #eeeeee; color: black; font-size: 14px;
tr.d1 td {
	background-color: #C0C0C0; color: black; font-size: 14px;

 <div id="RequestDetails">
<div id="divResultsSummary" style="display:none">
	<table id=tableRequestSummary border=1 style="width:100%">
		<tr class="d1"><td style="width:25%;font-weight:bold;">Request ID</td><td name=RequestID></td><td style="width:25%;font-weight:bold;">Request Initiated Date</td><td name=RequestInitiatedDate></td></tr>
		<tr class="d0"><td style="width:25%;font-weight:bold;">Request Status</td><td name=RequestStatus></td><td style="width:25%;font-weight:bold;">Request Closed Date</td><td name=RequestClosedDate></td></tr>
<br />
<div id=divResultsMain  style="display:none">
   <table style="width:100%">
     <tr class="d0"><td style="width:25%;font-weight:bold;">Department </td><td name=Department></td></tr>
     <tr class="d1"><td style="width:25%;font-weight:bold;">Requestor Name </td><td name=RequestorName></td></tr>
     <tr class="d0"><td style="width:25%;font-weight:bold;">Requestor Phone </td><td name=RequestorWorkPhone></td></tr>
     <tr class="d1"><td style="width:25%;font-weight:bold;">Requestor Email </td><td name=RequestorEmail></td></tr>
     <tr class="d0"><td style="width:25%;font-weight:bold;">Description </td><td name=RequestType></td></tr>
     <tr class="d1"><td style="width:25%;font-weight:bold;">Details </td><td name=RequestComments></td></tr>
     <tr class="d0"><td style="width:25%;font-weight:bold;">Request Location </td><td name=RequestLocation></td></tr>
     <tr class="d1"><td style="width:25%;font-weight:bold;">Primary Site Contact </td><td name=PrimarySiteContact></td></tr>
     <tr class="d0"><td style="width:25%;font-weight:bold;">Secondary Site Contact </td><td name=SecondarySiteContact></td></tr>
<br /><br />
<div id="divResultsRelatedWorkActivity" style="display:none">
<div><b>Related Work Activity</b></div><br />
<table id=tableRelatedWorkActivity border=1 style="width:100%">
   <tr class="d1"><td style="width:25%;font-weight:bold;">WO #</td><td name="WONo"></td><td style="width:25%;font-weight:bold;">WO Initiated Date</td><td name=WOInitiatedDate></td></tr>
   <tr class="d0"><td style="width:25%;font-weight:bold;">WO Status</td><td name=WOStatus></td><td style="width:25%;font-weight:bold;">Projected Finish Date</td><td name=FinishDate></td></tr>
<table id=tableRelatedWorkActivity border=1 style="width:100%">
   <tr class="d1"><td style="width:25%;font-weight:bold;">WO Note</td><td textarea rows="10" cols="50" name=WOInstructions></td></tr>

Open in new window

UPDATE: I suspect that part of the problem is that dataTable is looking for a value for a particular parameter but that value is either null or available.

Assuming that this theory is correct, any workaround for null values?
Question by:sammySeltzer
  • 3
  • 3

Expert Comment

by:Ahmed Merghani
ID: 40554041

I faced this error before! Yes your data seems to be empty! Try to debug the returned data from
phpservices/getUserDeptRequests.php?loginName=<?php echo $user; ?>"

Open in new window

by run the above url in the browser - after replacing PHP part and complete the URL by adding the host-.
Or, you can install any http debuger on your browser. For example, firebug for firefox. When you enter the page that load the table, you will see the data fetched from server.
LVL 28

Author Comment

ID: 40554056
Hi Ahmed,

Thanks for your response.

It has become clear that that's the problem.

Question though, what is the workaround for this?

As you know, you can't control what users enter into the database. However, under normal circumstances, for instance, using .net or php or some other technology, you can add some checks to replace, for instance null with 0 or '' (empty string).

How can that be handled in our case where most of the code is jquery?

How did you resolve yours having identified as we have in this case, what the issue is?

Accepted Solution

Ahmed Merghani earned 500 total points
ID: 40554082
I forget to mentioned that not only the returned value is empty "[]" but also there unexpected character/format or something. for example in my case, there was space that break the JSON format I send from the server!
If you post the "getUserDeptRequests.php" script and some dummy data for it so I can investigate more.
Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

LVL 28

Author Comment

ID: 40554155
Ok, I am going to try to do some few manipulations and see how far I go.

Then I will come back with update.

Thanks for your assistance.
LVL 28

Author Comment

ID: 40554487
Ok, I FIXED it!

An extra comma was the culprit:

          { mDataProp: "RequestStatus",  "sWidth": "100px", sSortable: true },


As soon as I got rid of that comma, it worked.

Thanks for responding

Expert Comment

by:Ahmed Merghani
ID: 40554865
You are welcome.

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

839 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question