Error Message - Requested unknown parameter 'branch' for row 352, column 0.
Error Message - Requested unknown parameter 'branch' for row 352, column 0.
TasneemImamKhan
Posts: 4Questions: 2Answers: 0
Hello All,
I am having the following error when clicking on the "Edit" button in Datatables Editor:
DataTables warning: table id=myTable - Requested unknown parameter 'branch' for row 352, column 0. For more information about this error, please see http://datatables.net/tn/4
The Json String that is returned looks like this and according to JsonLint.com, it is valid Json :
{"data":"[{\"branch\":\"Test\",\"studentFirstName\":\"Tenzin\",\"studentLastName\":\"Gurung\",\"phone1\":\"6465496153\",\"phone2\":\"\",\"phone3\":\"\",\"email1\":\"ktsamchoe@gmail.com\",\"email2\":\"\",\"grade\":\"7\",\"total_classes_enrolled\":\"100\",\"classes_remaining_transition\":\"6\",\"classes_taken_transition\":\"\",\"classes_remaining\":\"\",\"package_start_date\":\"July 2017\",\"package_expiration_date\":\"August 2018\",\"student_id\":\"4\",\"sales_id\":\"\"}]"}
My jsp page looks like this:
....
var editor;
$(document).ready(function () {
editor = new $.fn.dataTable.Editor( {
table: '#myTable',
idSrc: 'student_id',
bServerSide: true,
"sAjaxSource": "http://localhost:8080/KhansTutorialPortal2/FetchCCRecords.action?fetchData=FetchCCRecords",
"sServerMethod" : "POST",
"bProcessing" : true,
ajax: {
edit: {
type: 'PUT',
url: "http://localhost:8080/KhansTutorialPortal2/UPDATE.action",
datatype : "json",
contentType: "application/json; charset=utf-8",
data: function ( d ) {
var tmp = d['data'];
d = tmp;
return JSON.stringify( d );
}
},
remove: {
type: 'POST',
url: "http://localhost:8080/KhansTutorialPortal2/DELETE.action",
contentType: 'application/json',
data: function ( d ) {
var tmp = d['data'];
d = tmp;
return JSON.stringify( d );
}
}
},
fields: [
{ label: 'Branch', name: 'branch' },
{ label: 'First Name', name: 'studentFirstName' },
{ label: 'Last Name', name: 'studentLastName' },
{ label: 'Phone 1', name: 'phone1' },
{ label: 'Phone 2', name: 'phone2' },
{ label: 'Phone 3', name: 'phone3' },
{ label: 'Email 1', name: 'email1' },
{ label: 'Email 2', name: 'email2' },
{ label: 'Grade', name: 'grade' },
{ label: 'Total Classes Enrolled', name: 'total_classes_enrolled' },
{ label: 'Classes Remaining Transition', name: 'classes_remaining_transition' },
{ label: 'Classes Taken Transition', name: 'classes_taken_transition' },
{ label: 'Classes Remaining', name: 'classes_remaining' },
{ label: 'Package Start Date', name: 'package_start_date' },
{ label: 'Package Expiration Date', name: 'package_expiration_date' },
{ label: 'Student ID', name: 'student_id' },
{ label: 'Sales ID', name: 'sales_id' }
]
} );
$('#myTable').DataTable( {
dom: 'Bfrtip',
"ordering": false,
"pagingType": "full_numbers",
columns: [
{ data: 'branch' },
{ data: 'studentFirstName' },
{ data: 'studentLastName' },
{ data: 'phone1' },
{ data: 'phone2' },
{ data: 'phone3' },
{ data: 'email1' },
{ data: 'email2' },
{ data: 'grade' },
{ data: 'total_classes_enrolled' },
{ data: 'classes_remaining_transition' },
{ data: 'classes_taken_transition' },
{ data: 'classes_remaining' },
{ data: 'package_start_date' },
{ data: 'package_expiration_date' },
{ data: 'student_id' },
{ data: 'sales_id' }
],
select: true,
buttons: [
{ extend: 'edit', editor: editor },
{ extend: 'remove', editor: editor }
]
} );
});
.....
<h1 class="text-center"><small class="text-muted">Student List</small></h1>
<s:if test="fetchData=='FetchCCRecords'">
<div style="margin-top: 40px; margin-right: 50px; margin-left: 50px;">
<table class="table table-hover table-striped table-bordered table-condensed" id="myTable">
<thead>
<tr style="background-color: #E0E0E1;">
<th>Branch</th>
<th>Student First Name</th>
<th>Student Last Name</th>
<th>Phone 1</th>
<th>Phone 2</th>
<th>Phone 3</th>
<th>Email 1</th>
<th>Email 2</th>
<th>Grade</th>
<th>Total Classes Enrolled</th>
<th>Classes Remaining Transition</th>
<th>Classes Taken Transition</th>
<th>Classes Remaining</th>
<th>Package Start Date</th>
<th>Package Expiration Date</th>
<th>Student ID</th>
<th>Sales ID</th>
</tr>
</thead>
<s:iterator value="dataList">
<tr>
<td><s:property value="branch" /></td>
<td><s:property value="studentFirstName" /></td>
<td><s:property value="studentLastName" /></td>
<td><s:property value="phone1" /></td>
<td><s:property value="phone2" /></td>
<td><s:property value="phone3" /></td>
<td><s:property value="email1" /></td>
<td><s:property value="email2" /></td>
<td><s:property value="grade" /></td>
<td><s:property value="total_classes_enrolled" /></td>
<td><s:property value="classes_remaining_transition" /></td>
<td><s:property value="classes_taken_transition" /></td>
<td><s:property value="classes_remaining" /></td>
<td><s:property value="package_start_date" /></td>
<td><s:property value="package_expiration_date" /></td>
<td><s:property value="student_id" /></td>
<td><s:property value="sales_id" /></td>
</tr>
</s:iterator>
</table>
</div>
</s:if>
I have tried to work on this for a week now before finally buckling down and asking this fantastic forum for assistance. Any guidance would be greatly appreciated.
Also, I am using mysql, java struts2, and jsp.
Thank you so much!
Answers
The escaped quotes (
\") and the quotes around the data array{"data":"[...]"}suggests that the row data is being converted to a JSON string twice in your server script. The response should look more like the response shown in the Editor client/server exchange docs.Kevin
Thank you so much for your guidance! IT WORKS!!!!
To save others from similar torture, I will provide my solution below. Basically, my issue was just as you said - my array was enclosed in quotes, thus the datatable couldnt find the items inside my array.
I'm using jackson to create my json response in my java struts action class. The initial issue was that I had a string called "data" that I set the Json array object to. Because I did this, the array was automatically enclosed in quotes when sent to the client. I was trying to figure out how to get rid of these pesky quotes when I realized through your guidance to use the outputstream instead. My code is below:
ObjectMapper mapper = new ObjectMapper();
ObjectNode dataNode = mapper.createObjectNode();
ObjectNode jsonObject = mapper.createObjectNode();
ArrayNode arrayObject = mapper.createArrayNode();
jsonObject.put("branch", jsonMap.get("branch"));
jsonObject.put("studentFirstName", jsonMap.get("studentFirstName"));
jsonObject.put("studentLastName", jsonMap.get("studentLastName"));
jsonObject.put("phone1", jsonMap.get("phone1"));
jsonObject.put("phone2", jsonMap.get("phone2"));
jsonObject.put("phone3", jsonMap.get("phone3"));
jsonObject.put("email1", jsonMap.get("email1"));
jsonObject.put("email2", jsonMap.get("email2"));
jsonObject.put("grade", jsonMap.get("grade"));
jsonObject.put("total_classes_enrolled", jsonMap.get("total_classes_enrolled"));
jsonObject.put("classes_remaining_transition", jsonMap.get("classes_remaining_transition"));
jsonObject.put("classes_taken_transition", jsonMap.get("classes_taken_transition"));
jsonObject.put("classes_remaining", jsonMap.get("classes_remaining"));
jsonObject.put("package_start_date", jsonMap.get("package_start_date"));
jsonObject.put("package_expiration_date", jsonMap.get("package_expiration_date"));
jsonObject.put("student_id", jsonMap.get("student_id"));
jsonObject.put("sales_id", jsonMap.get("sales_id"));
arrayObject.add(jsonObject);
dataNode.set("data", arrayObject);
data = mapper.writeValueAsString(dataNode);
HttpServletResponse response = ServletActionContext.getResponse();
response.setContentType("application/json");
response.setCharacterEncoding("UTF-8");
PrintWriter out = response.getWriter();
out.println(data);
out.flush();
out.close();
Thank you so much again!!! Good luck to all of us developers