Related
I am getting below error as Ajax call response.
Below is the response body for Ajax call.
Apache Tomcat/7.0.61 - Error report
HTTP Status 500 - org.apache.struts.chain.commands.InvalidPathException: No action config found for the specified url.type Status reportmessage org.apache.struts.chain.commands.InvalidPathException: No action config found for the specified url.description The server encountered an internal error that prevented it from fulfilling this request.Apache Tomcat/7.0.61
Is it something to do with JRE 7?
Here is the JavaScript code from my JSP file.
I have defined a table in my JSP file which is referenced here.
function showLogHistory() {
var questionId = document.getElementById('txtQuestionId').innerHTML;
var url = "myAction.do?dispatchMethodName=showmyAudit&questionId="+questionId;
if ( $.fn.DataTable.isDataTable('#tblmyAudit') ) {
$('#tblmyAudit').DataTable().destroy();
}
$('#tblmyAudit').DataTable( {
"initComplete": function(settings, json) {
$("#tblmyAudit tbody tr.data-in-table").each(function () {
var i=0;
$(this).find('td').each(function (index) {
var currentCell = $(this);
var nextCell =
$(this).closest('tr').next('tr').find('td').eq(i).length > 0 ?
$(this).closest('tr').next('tr').find('td').eq(i) : null;
if ( currentCell.text() !== nextCell.text()) {
currentCell.css('backgroundColor', 'yellow');
}
i=i+1;
});
});
},
"ajax": {
"url": url,
"cache": true
},
"columns": [
{ "data": "questionId" },
{ "data": "Category" },
{ "data": "Area" },
{ "data": "question" },
{ "data": "answer" },
{ "data": "updated_by" },
{ "data": "updated_date" }
],
"scrollX": true,
"columnDefs": [ {
"targets": [ '_all' ],
"orderable": false
} ],
"createdRow": function( row, data, dataIndex ) {
$(row).addClass( 'data-in-table' );
}
} );
$('#detmyAudit').modal('show');
}
URL that gets generated for Ajax seems proper.
I'm using javascript and kendo ui.
I have a grid and populate it with
a local datasource
ie:
var dsDataSource = new kendo.data.DataSource({
data:
[
{ // 1
title: "Star Wars: A New Hope",
date5: new Date(2001,8,8,21,46,0,0), // 9/8/2001 09:46:00.000 PM
},
{ // 2
title: "Star Wars: The Empire Strikes Back",
date5: new Date(2004,10,9,6,33,0,0), // 11/9/2004 06:33:00.000 AM
},
{ // 3
title: "Star Wars: Return of the Jedi",
date5: new Date("2004/11/09 12:00 AM"), // 11/9/2004 12:00:00.000 AM
},
{ // 4
title: "Star Wars: The Phantom Menace",
date5: new Date(2008,0,10,4,20,0,0), // 1/10/2008 04:20:00.000 AM
},
{ // 5
title: "Star Wars: Revenge of the Sith",
date5: new Date("2004/11/09 06:30 AM"), // 11/9/2004 06:30:00.000 AM
}
],
schema:
{
model:
{
id: "myGridID",
fields:
{
title: { type: "string" },
date5: { type: "date" },
date6: { type: "date" }, // Field not in data: above
// // but generated below in
// // parse:
}
},
},
// Set the data in
// date6 to date5 yyyy, MM, dd, HH, mm and strip off Sec and Ms
// This will make the filter work
// This changes the "data" instead of the "presentation" so the filter will work
parse: function(d) {
$.each(d, function(idx, elem) {
elem.date6 =
new Date(
elem.date5.getFullYear(), // 20yy
elem.date5.getMonth(), // MM 00 - 11 for jan to dec
elem.date5.getDate(), // dd 00 - 31
elem.date5.getHours(), // HH 00 - 23
elem.date5.getMinutes() // mm 00 - 59
// // Sec 0
// // Ms 0
);
});
return d;
}
});
I then create a grid:
// Createe a Kendo grid in DIV
$("#grid").kendoGrid({
dataSource: dsDataSource,
...
columns: [
{ field: "title", title: "Title" , width: "270px" },
{ field: "date5", title: "D 5" , width: "230px", filterable: false, format:"{0:MM/dd/yyyy hh:mm tt}", },
{
// Bind to date6 (rounded), but display date5
field: "date6",
title: "Date5DateTime (no D6 data uses D5)",
width: "330px",
template: "#: kendo.toString(date5, 'yyyy-MM-dd HH:mm:ss.fff') #",
filterable: { ui: DateTimeFilter },
...
}
],
...
I got this to work and am now integrating it into our production application.
The problem I am having is that the production application uses Json/database
so when I try to add the "date6" field into the "model: ... fields: ..." section
it complains about the "date6" field not existing in the Json/database.
Without the "date6" field in the "model..." I can't use the parse: code to strip off
the Sec and Ms.
Is there some other way to fill in the "date6"
without using "parse:" so I don't have to add "date6" to the "model: ... fields: ..."
section?
You don't have to define date6 in the model, it should work perfectly well. The problem is that you defined parse out of schema when it should be inside and then it actually does not get called.
Your dataSource definition should be:
var dsDataSource = new kendo.data.DataSource({
data:
[
{ // 1
title: "Star Wars: A New Hope",
date5: new Date(2001,8,8,21,46,0,0), // 9/8/2001 09:46:00.000 PM
},
{ // 2
title: "Star Wars: The Empire Strikes Back",
date5: new Date(2004,10,9,6,33,0,0), // 11/9/2004 06:33:00.000 AM
},
{ // 3
title: "Star Wars: Return of the Jedi",
date5: new Date("2004/11/09 12:00 AM"), // 11/9/2004 12:00:00.000 AM
},
{ // 4
title: "Star Wars: The Phantom Menace",
date5: new Date(2008,0,10,4,20,0,0), // 1/10/2008 04:20:00.000 AM
},
{ // 5
title: "Star Wars: Revenge of the Sith",
date5: new Date("2004/11/09 06:30 AM"), // 11/9/2004 06:30:00.000 AM
}
],
schema:
{
model:
{
id: "myGridID",
fields:
{
title: { type: "string" },
date5: { type: "date" },
date6: { type: "date" }, // Field not in data: above
// // but generated below in
// // parse:
}
},
// Set the data in
// date6 to date5 yyyy, MM, dd, HH, mm and strip off Sec and Ms
// This will make the filter work
// This changes the "data" instead of the "presentation" so the filter will work
parse: function(d) {
$.each(d, function(idx, elem) {
elem.date6 =
new Date(
elem.date5.getFullYear(), // 20yy
elem.date5.getMonth(), // MM 00 - 11 for jan to dec
elem.date5.getDate(), // dd 00 - 31
elem.date5.getHours(), // HH 00 - 23
elem.date5.getMinutes() // mm 00 - 59
// // Sec 0
// // Ms 0
);
});
return d;
}
}
});
and check it here running
$(document).ready(function() {
var dsDataSource = new kendo.data.DataSource({
data:
[
{ // 1
title: "Star Wars: A New Hope",
date5: new Date(2001,8,8,21,46,0,0), // 9/8/2001 09:46:00.000 PM
},
{ // 2
title: "Star Wars: The Empire Strikes Back",
date5: new Date(2004,10,9,6,33,0,0), // 11/9/2004 06:33:00.000 AM
},
{ // 3
title: "Star Wars: Return of the Jedi",
date5: new Date("2004/11/09 12:00 AM"), // 11/9/2004 12:00:00.000 AM
},
{ // 4
title: "Star Wars: The Phantom Menace",
date5: new Date(2008,0,10,4,20,0,0), // 1/10/2008 04:20:00.000 AM
},
{ // 5
title: "Star Wars: Revenge of the Sith",
date5: new Date("2004/11/09 06:30 AM"), // 11/9/2004 06:30:00.000 AM
}
],
schema:
{
model:
{
id: "myGridID",
fields:
{
title: { type: "string" },
date5: { type: "date" },
date6: { type: "date" }, // Field not in data: above
// // but generated below in
// // parse:
}
},
// Set the data in
// date6 to date5 yyyy, MM, dd, HH, mm and strip off Sec and Ms
// This will make the filter work
// This changes the "data" instead of the "presentation" so the filter will work
parse: function(d) {
$.each(d, function(idx, elem) {
elem.date6 =
new Date(
elem.date5.getFullYear(), // 20yy
elem.date5.getMonth(), // MM 00 - 11 for jan to dec
elem.date5.getDate(), // dd 00 - 31
elem.date5.getHours(), // HH 00 - 23
elem.date5.getMinutes() // mm 00 - 59
// // Sec 0
// // Ms 0
);
});
return d;
}
}
});
$("#grid").kendoGrid({
dataSource: dsDataSource,
columns: [
{ field: "title", title: "Title" , width: "270px" },
{ field: "date5", title: "D 5" , width: "230px", filterable: false, format:"{0:MM/dd/yyyy hh:mm tt}" },
{
// Bind to date6 (rounded), but display date5
field: "date6",
title: "Date5DateTime (no D6 data uses D5)",
width: "330px",
template: "#: kendo.toString(date5, 'yyyy-MM-dd HH:mm:ss.fff') #"
}
]
})
});
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.default.min.css">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.3.1316/js/kendo.all.min.js"></script>
<div id="grid"></div>
is it possible to sum fields in a row of kendo grid? I'm able to summary columns in table but not a single rows. I've set aggregation for each field but it works only for "footerTemplate". I hope my question is clear... Thanks for any help!
Example:
User | Jan | Feb | Mar | Sum
John | 1000 | 2000 | 3000 | ???
Peter | 1500 | 2500 | 3500 | ???
footerTemplate SUM | 2500 | 4500 | 6500 | ???
In DataSource I define aggregation and group:
aggregate: [
{ field: "Jan", aggregate: "sum" },
{ field: "Feb", aggregate: "sum" }, ...
],
...
group: {field: "???", aggregates: [ { field: "Jan", aggregate: "sum" }, { field: "Feb", aggregate: "sum" } ]}
...
columns: [
...,
{ "field": "???", "title": "Summary", "format": "{0:n0}", "footerTemplate": "#= kendo.toString(sum, \"C\")#", "groupFooterTemplate": "#= kendo.toString(sum, \"C\")#" },
]
Thanks very much for any answer
The easiest way of getting it is defining an extra column (lets call it Sum) in the Grid that computes the value for you. This extra column uses a template for compute the value and this computation can be either invoking a function in your model (the cleanest) or directly hard code it.
Example:
// DataSource Definition
var ds = new kendo.data.DataSource({
data: [
{ Id:1, User: "John", Jan : 1000, Feb: 2000, Mar: 3000 },
{ Id:2, User: "Peter", Jan : 1500, Feb: 2500, Mar: 3500 }
],
pageSize: 10,
schema: {
model: {
id: "Id",
fields: {
Id: { type: 'number' },
User: { type: 'string' },
Jan: { type: 'number' },
Feb: { type: 'number' },
Mar: { type: 'number' }
},
Sum: function() {
return this.Jan + this.Feb + this.Mar;
}
}
}
});
Where I've defined a Sum function that computes the total for the fields Jan through Mar.
Then the Grid definition would be:
var grid = $("#grid").kendoGrid({
dataSource: ds,
pageable: true,
columns: [
{ field: "User" },
{ field: "Jan" },
{ field: "Feb" },
{ field: "Mar" },
{ title: "Sum", template: "#= Sum() #" }
]
}).data("kendoGrid");
NOTE: I'm not including the aggregates since you do not have problems with this.
As you can see the Sum column computes the sum when invoked from the template. See it here : http://jsfiddle.net/OnaBai/Bz3Y5/
The second approach would be not having Sum function but computing the value in the template.
var grid = $("#grid").kendoGrid({
dataSource: ds,
pageable: true,
columns: [
{ field: "User" },
{ field: "Jan" },
{ field: "Feb" },
{ field: "Mar" },
{ title: "Sum", template: "#= data.Jan + data.Feb + data.Mar #" }
]
}).data("kendoGrid");
See it implemented here: http://jsfiddle.net/OnaBai/Bz3Y5/2/
The disadvantage with this two approaches is that you have to compute the total each time the template is invoked so if you paginate you might have some extra processing. If you want to avoid this, then you can use parse function in the DataSource:
var ds = new kendo.data.DataSource({
data: [
{ Id:1, User: "John", Jan : 1000, Feb: 2000, Mar: 3000 },
{ Id:2, User: "Peter", Jan : 1500, Feb: 2500, Mar: 3500 }
],
pageSize: 10,
schema: {
model: {
id: "Id",
fields: {
Id: { type: 'number' },
User: { type: 'string' },
Jan: { type: 'number' },
Feb: { type: 'number' },
Mar: { type: 'number' }
}
},
parse: function (d) {
$.each(d, function (idx, elem) {
elem.Sum = elem.Jan + elem.Feb + elem.Mar;
});
return d;
}
}
});
This parse function receives the original data and transforms it in whatever you want, adding, removing, transforming any field in the original data and before sending it to the Grid.
You can see this last approach here : http://jsfiddle.net/OnaBai/Bz3Y5/3/
Using Kendo UI with MVC3.
Using the network tab on developer tool, I can see all the correct data is being sent, but when I hover over the model parameter that is coming into the controller method, the dates are all 1/1/0001. Here is some data:
Header info from network request tab (shows the correct data is going to the controller:
Accept:application/json, text/javascript, */*; q=0.01
Content-Type:application/x-www-form-urlencoded; charset=UTF-8
Origin:http://localhost:47621
Referer:http://localhost:47621/NewOrder/Detail/18
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.31 (KHTML, like Gecko) Chrome/26.0.1410.64 Safari/537.31
X-Requested-With:XMLHttpRequest
Form Dataview sourceview URL encoded
CommentId:9
CommentText:blah blah random text.
IncidentId:7
ModifiedBy:admin
ModifiedDate:Thu Jun 06 2013 08:15:08 GMT-0700 (Pacific Daylight Time)
CreatedBy:admin
CreatedDate:Thu Jun 06 2013 08:15:08 GMT-0700 (Pacific Daylight Time)
kendo code:
var IncId = $("#IncidentId").val();
var ds_CommentsGrid = new kendo.data.DataSource({
transport: {
read : {
url : '#Url.Action("JsonGetComments", "TrespassOrder")/' + IncId,
dataType: 'json',
type : "POST"
},
update : {
url : '#Url.Action("JsonEditComment", "TrespassOrder")',
dataType: 'json',
type : "POST"
},
parameterMap: function (options, operation) {
if (operation !== "read" && options.models) {
var values = {};
values["CommentId"] = options.models[0].CommentId;
values["CommentText"] = options.models[0].CommentText;
values["IncidentId"] = options.models[0].IncidentId;
values["ModifiedBy"] = options.models[0].ModifiedBy;
values["ModifiedDate"] = options.models[0].ModifiedDate;
values["CreatedBy"] = options.models[0].CreatedBy;
values["CreatedDate"] = options.models[0].CreatedDate;
return values;
}
}
},
batch : true,
schema : {
model: {
id : "CommentId",
fields: {
CommentId : { editable: false },
CommentText : { editable: true },
CreatedDate : { editable: false, type: "date"},
ModifiedDate: { editable: false, type: "date" },
CreatedBy : { editable: false },
ModifiedBy : { editable: false }
}
}
},
pageSize : 5
});
$(document).ready(function () {
$("#Comment-List").kendoGrid({
dataSource: ds_CommentsGrid,
sortable : true,
filterable: { extra: false, operators: {
string: { startswith: "Starts with", eq: "Is equal to" }
}
},
pageable : true,
columns : [
{ field: "CommentText", title: "Comment", width: 300, filterable: false },
{ field: "CreatedBy", title: "Author", filterable: false },
{ field: "CreatedDate", title: "Original Date", format: "{0:g}", filterable: { ui: "datetimepicker" } },
{ field: "ModifiedBy", title: "Edited By", filterable: false },
{ field: "ModifiedDate", title: "Editted On", format: "{0:g}", filterable: { ui: "datetimepicker" } },
{ command: ["edit"], title: "Actions" }
],
editable : "popup"
});
});
I am wondering about the content type as noted in the request header, is it correct?
Try sending the response as json:
update: {
url : '#Url.Action("JsonEditComment", "TrespassOrder")',
dataType: 'json',
type : "POST",
contentType: "application/json"
},
parameterMap: function (options, operation) {
if (operation !== "read" && options.models) {
var values = {};
values["CommentId"] = options.models[0].CommentId;
values["CommentText"] = options.models[0].CommentText;
values["IncidentId"] = options.models[0].IncidentId;
values["ModifiedBy"] = options.models[0].ModifiedBy;
values["ModifiedDate"] = options.models[0].ModifiedDate;
values["CreatedBy"] = options.models[0].CreatedBy;
values["CreatedDate"] = options.models[0].CreatedDate;
return JSON.stringify(values);
}
}
ASP.NET MVC can't parse the string representation of a JavaScript Date object. However it can parse it when it is serialized as JSON.
I am trying to load .json data into my web app and it never can achieve success.
It always returns the error function.
Here is my .js file:
$(document).ready(function () {
var output = $('#stage');
$.ajax({
url: 'http://www.haverhill-ps.org/ios/app/data/calendar-json.json',
dataType: 'json',
timeout: 5000,
success: function (data) {
$.each(data, function (i, item) {
var eventInfo = '<h1>' + item.month + '</h1>' + '<p>' + item.date + '<br>' + item.time + '</p>';
output.append(eventInfo);
});
},
error: function () {
output.text('There was an error loading the data.');
}
});
});
Here is the json data:
{
"month": "June", //November
"date": "10", //10
"time": "5PM", //5PM
}, {
"month": "July", //November
"date": "4", //10
"time": "1PM", //5PM
}
Then, within my html I have a div setup:
<div id="stage">Run here...</div>
the returned data is not valid json.
your are missing [and ] around the result and comments are not valid in json.
the , at the end of the last element of each object is also invalid. you can validate your json at e.g. http://jsonlint.com/
a valid json would look this way:
[{
"month": "June",
"date": "10",
"time": "5PM"
}, {
"month": "July",
"date": "4",
"time": "1PM"
}]
May be you would like to see what is the error, do it this way
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(thrownError);
}