This is a migrated thread and some comments may be shown as answers.

How to Handle Dates between WebAPI & JQUery

4 Answers 109 Views
Grid
This is a migrated thread and some comments may be shown as answers.
N
Top achievements
Rank 1
N asked on 27 Dec 2013, 04:51 PM
I am getting Modelvalidation , ErrorMessage = "The value 'Wed Dec 25 2013 00:00:00 GMT-0600 (Central Standard Time)' is not valid for EffectiveDate."
1) How to handle dates, so that i can avoid such errors. Even though i like how you are able to send timezone along with Date,
    what changes will i have to make to the models datatype to make it work.
 
The response from the WebAPI is 
{"$id":"1","Message":"Therequestisinvalid.","ModelState":{"$id":"2","orgschool.EffectiveDate":["Thevalue'WedDec25201300:00:00GMT-0600(CentralStandardTime)'isnotvalidforEffectiveDate."],"orgschool.TerminationDate":["Thevalue'MonDec30201300:00:00GMT-0600(CentralStandardTime)'isnotvalidforTerminationDate."]}}

2) Also i would like to know how can i display the errors in their respective fields, in the grid

======================================================================================================================
WebApiConfig has the following settings
           config.EnableQuerySupport();
           var json = config.Formatters.JsonFormatter;
            json.SerializerSettings.PreserveReferencesHandling = Newtonsoft.Json.PreserveReferencesHandling.Objects;
            json.SerializerSettings.ReferenceLoopHandling = Newtonsoft.Json.ReferenceLoopHandling.Ignore;
            config.Formatters.Remove(config.Formatters.XmlFormatter);
            // Web API routes
            config.MapHttpAttributeRoutes();
            config.EnableCors(new EnableCorsAttribute("*", "*", "*"));
======================================================================================================================
The header post is as follow

Request URL:http://localhost:3103/api/OrgSchool/PostOrgSchool
Request Method:POST
Status Code:400 Bad Request
Request Headersview source
Accept:application/json, text/javascript, */*; q=0.01
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Content-Length:2927
Content-Type:application/x-www-form-urlencoded; charset=UTF-8
Host:localhost:3103
Origin:http://localhost:1205
Referer:http://localhost:1205/KendoOrgSchools.html
User-Agent:Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.1650.63 Safari/537.36
Form Dataview sourceview URL encoded
$id:2
OrgSchoolsID_PK:3
OrgID_FK:15
SchoolCode:PBS-KHN
SchoolName:modified
Description:hkjlhkj
MailAttentionOfName:hjkh
Address1:hjhjk
Address2:jhjk
CountryID_FK:3
StateID_FK:1
CityID_FK:1
PinZipCode:3dgg
EffectiveDate:Wed Dec 25 2013 00:00:00 GMT-0600 (Central Standard Time)
TerminationDate:Mon Dec 30 2013 00:00:00 GMT-0600 (Central Standard Time)
CreatedByUserID_FK:1
DateCreated:0001-01-01T00:00:00
UpdatedByUserID_FK:1
DateUpdated:0001-01-01T00:00:00
RowStatusID_FK:1
City[$id]:3
City[CityID_PK]:1
City[StateID_FK]:1
City[Code]:KH
City[Name]:KhN
City[Description]:
City[EffectiveDate]:
City[TerminationDate]:
City[CreatedByUserID_FK]:1
City[DateCreated]:2013-12-07T00:00:00
City[UpdatedByUserID_FK]:1
City[DateUpdated]:2013-12-07T00:00:00
City[RowStatusID_FK]:1
City[User]:
City[RowStatu]:
City[State][$id]:4
City[State][StateID_PK]:1
City[State][CountryID_FK]:3
City[State][Code]:PB
City[State][Name]:PNJB
City[State][Description]:
City[State][EffectiveDate]:
City[State][TerminationDate]:
City[State][CreatedByUserID_FK]:1
City[State][DateCreated]:2013-12-07T00:00:00
City[State][UpdatedByUserID_FK]:1
City[State][RowStatusID_FK]:1
City[State][Cities][0][$ref]:3
City[State][Country][$id]:5
City[State][Country][CountryID_PK]:3
City[State][Country][Code]:IN
City[State][Country][Name]:India
City[State][Country][Desription]:India
City[State][Country][EffectiveDate]:
City[State][Country][TerminationDate]:
City[State][Country][CreatedByUserID_FK]:1
City[State][Country][DateCreated]:2013-12-07T00:00:00
City[State][Country][UpdatedByUserID_FK]:1
City[State][Country][RowsStatusID_FK]:1
City[State][Country][User]:
City[State][Country][RowStatu]:
City[State][Country][User1]:
City[State][Country][OrgSchools][0][$ref]:2
City[State][Country][States][0][$ref]:4
City[State][OrgSchools][0][$ref]:2
City[State][RowStatu]:
City[State][User]:
City[State][User1]:
City[User1]:
City[OrgSchools][0][$ref]:2
Country[$ref]:5
Org[$id]:6
Org[OrgID_PK]:15
Org[OrgCode]:PBS updated
Org[OrgName]:PNJB Education Board
Org[OrgDescription]:
Org[EffectiveDate]:
Org[TerminationDate]:
Org[CreatedByUserID_FK]:1
Org[DateCreated]:0001-01-01T00:00:00
Org[UpdatedByUserID_FK]:1
Org[DateUpdated]:0001-01-01T00:00:00
Org[RowStatusID_FK]:1
Org[User]:
Org[RowStatu]:
Org[User1]:
Org[OrgSchools][0][$ref]:2
User:
RowStatu:
State[$ref]:4
User1:
Date:Invalid Date
Response Headersview source
Access-Control-Allow-Origin:*
Cache-Control:no-cache
Content-Length:340
Content-Type:application/json; charset=utf-8
Date:Fri, 27 Dec 2013 16:44:24 GMT
Expires:-1
Pragma:no-cache
Server:Microsoft-IIS/8.0
X-AspNet-Version:4.0.30319
X-Powered-By:ASP.NET
X-SourceFiles:=?UTF-8?B?QzpcVXNlcnNcbnNzaWRfMDAwXERvY3VtZW50c1xWaXN1YWwgU3R1ZGlvIDIwMTNcUHJvamVjdHNcU2Nob29sTWFuYWdlbWVudFxTY2hvb2xNYW5hZ2VtZW50LkhUTUw1XGFwaVxPcmdTY2hvb2xcUG9zdE9yZ1NjaG9vbA==?=


4 Answers, 1 is accepted

Sort by
0
Atanas Korchev
Telerik team
answered on 30 Dec 2013, 12:58 PM
Hello,

We are not sure how this issue is related to Kendo UI. Please clarify.

Regards,
Atanas Korchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
N
Top achievements
Rank 1
answered on 30 Dec 2013, 04:21 PM
The Dates in questions are being posted from Kendo ui Grid.

When using MVC view i don't have any problems. I also tried infragistics ignite ui grid that does not have problem either, all of them are using the same DAL WebAPI models.

so i think this has to do something with how the dates are passed back from kendo ui.
0
Atanas Korchev
Telerik team
answered on 31 Dec 2013, 10:09 AM
Hi,

The Kendo UI grid uses $.ajax to make Ajax requests. This is the format used by default by jQuery.

I recommend checking this demo which shows a working implementation of CRUD with Web API. It sends the parameters in JSON format.



Regards,
Atanas Korchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Accepted
N
Top achievements
Rank 1
answered on 01 Jan 2014, 08:29 PM

I was able to solve this by using the following code, i used moment javascript library for date processing in javascript.

 parameterMap: function (options, operation) {

                    //if (operation !== "read" && options.models) {
                    //    return { models: kendo.stringify(options.models) };
                    //}

                    if (operation != "read") {
                        options.EffectiveDate = moment(options.EffectiveDate).format("MM-DD-YYYY");
                        options.TerminationDate = moment(options.TerminationDate).format("MM-DD-YYYY")
                    }
                    var paramMap = kendo.data.transports.odata.parameterMap(options);

                     delete paramMap.$format; // <-- remove format parameter.

                    return paramMap;

                }
Tags
Grid
Asked by
N
Top achievements
Rank 1
Answers by
Atanas Korchev
Telerik team
N
Top achievements
Rank 1
Share this question
or