Menu
I'm new to the DataTables jquery plugin. After discovering that IE 8 had performance issues with Javascript I decided to change the way I use DataTables to do server side processing. I'm getting this error message when my JSP loads ( I'm using Spring 3 ):
DataTables warning (table id = 'results_table'): Requested unknown parameter '0' from the data source for row 0 I Googled around and found that many causes of that error message come down to malformed JSON so I found a way to output my JSON from my Spring 3 controller function to take a look at the JSON it makes and I changed my code to get it to be pretty close to what the DataTables site says it should look like.
Still no joy, still getting that error message.
The server side processing examples I found for DataTables didn't include code for specifying the columns used on the client side, so I assumed I don't need it. Do I?
Here are the relevant parts of my results.jsp:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>ACME: search results in a nice DataTables.net Plugin</title> </head> <body> <link rel="stylesheet" type="text/css" href="css/jquery.dataTables.css" /> <script language = "JavaScript" type = "text/javascript" src = "../nsd/js/jquery-1.7.js"></script> <script language = "JavaScript" type = "text/javascript" src = "../nsd/js/jquery.dataTables.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#results_table').dataTable( { "bProcessing": true, "bServerSide": true, "sScrollX": "600px", "sServerMethod": "POST", "sAjaxSource": "/acme/resultstable", } ); } ); </script> <form id="command" name="f" action="employee" method="post"> <div id = "results"> <table id = "results_table"> <thead> <tr> <th> </th> <th>ID</th> <th>NO_PRINT</th> <th>Full Name</th> <th>Email Address</th> <th>Phone Number</th> <th>Organization</th> <th>Organization Code</th> <th>Position</th> <th>Employee Type</th> </tr> </thead> <tbody> </tbody> </table> </body> </html> Here is the JSON response I've been sending to it:
{ "sEcho" : 1, "iTotalRecords" : 1, "iTotalDisplayRecords" : 1, "aaData" : [ { "person_id" : "888888", "ID" : "999999", "no_print" : " ", "fullname" : "Obama, Willard", "email_address" : "<a href = \"mailto:[email protected]\">[email protected]</a>", "current_phone_number" : "303-867-5309", "title" : " ", "office" : " ", "position" : "Contractor", "empl_code" : "CONT" } ] } Here is my Spring controller function I am using to send the JSON response via Jackson. This includes code to output my JSON so I can see what it looks like. Could the JSON it outputs to stdout and what I am sending back to DataTables be different?
@RequestMapping(value = "/resultstable", method = RequestMethod.POST) public @ResponseBody LinkedHashMap resultstable(ModelMap model, HttpSession session, @RequestParam (required=true) int sEcho, @RequestParam (required=true) int iDisplayStart, @RequestParam (required=true) int iDisplayLength, @RequestParam (required=true) int iColumns, @RequestParam (required=true) int iSortCol_0, @RequestParam (required=false)String sSortDir_0, @RequestParam (required=true) String sSearch ) { /* ********************************************************************** ** These come from the DataTables.net Jquery plugin on results.jsp ********************************************************************** ** sEcho, - just send it back, used by DataTables for synching ** iDisplayStart - index of the record to start with, ie 3 for the 3rd of 100 records ** iDisplayLength - number of records to send back starting with iDisplayStart ** iColumns - number of columns to be displayed in the table ** iSortCol_0 - the number of thee column to be sorted on ** sSortDir_0 - direction of sorting: asc or desc ** sSearch - from the search box, filter results further on this term ********************************************************************** */ String nextView = "results"; String usertype = (String)session.getAttribute("usertype"); Search search = new Search(usertype); List<LinkedHashMap> records = null; String results = null; int number_of_records = (Integer)session.getAttribute("number_of_records_found"); ResultsView rv = new ResultsView(); ResultsScreenTableHolder rstrh = null; SearchScreenDataHolder ssdh2 = (SearchScreenDataHolder)session.getAttribute("search_screen_data_holder"); ObjectMapper mapper = new ObjectMapper(); logger.debug("started"); logger.debug("sEcho, == " + sEcho ); logger.debug("iDisplayStart == " + iDisplayStart ); logger.debug("iDisplayLength == " + iDisplayLength ); logger.debug("iColumns == " + iColumns ); logger.debug("iSortCol_0 == " + iSortCol_0 ); logger.debug("sSortDir_0 == " + sSortDir_0 ); logger.debug("sSearch == " + sSearch ); try { records = search.searchForAnEmployee(ssdh2,usertype,sSearch,"asc", iSortCol_0,iDisplayStart, iDisplayLength); LinkedHashMap lhm= new java.util.LinkedHashMap(); lhm.put("sEcho", sEcho); lhm.put("iTotalRecords",number_of_records); lhm.put("iTotalDisplayRecords",9); lhm.put("aaData",records); // convert user object to json string, and save to a file mapper.writeValue(new File("c:\\Downloads\\rstrh.json.txt"), lhm); // display to console logger.debug("My JSON: " + mapper.defaultPrettyPrintingWriter().writeValueAsString(lhm)); } catch (Exception e) { logger.debug("\n",e); } return lhm; }// end function 
463
When using the ajax option to load data for DataTables, a general error can be triggered if the server responds with anything other than a valid HTTP 2xx response. The error given is: DataTables warning: table id= {id} - Ajax error. where {id} is the DOM id of the table that triggered the error.
targets option provides the information required by DataTables for which columns in the table the column definition object should be applied. It can be: 0 or a positive integer - column index counting from the left. A negative integer - column index counting from the right.
I ran into the same warning as well, but the cause was different. I had null values in my data. The JSON format was correct, but DataTables does not know have a default rule for displaying nulls. The solution was to use the sDefaultContent property.
Sample aaData:
aaData: [ { "Field1": "Foo", "Field2":null }, { "Field1": "Bar", "Field2":null }, ] And then on the aoColumns, you can use the property as follows:
aoColumns: [ { "mData": "Field1", sDefaultContent: "n/a" }, { "mData": "Field2", sDefaultContent: "" } ] This is not your current problem, but you may encounter this issue in the future.
Hope this was helpful.
174
I was having this same problem this morning. You need to have the aoColumns parameter and use mDataProp As in this:
https://gist.github.com/1660712
At least it solved my problem.
34
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
