Yasser Shaikh
Yasser Shaikh

Reputation: 47784

Datepicker format problemm in ASP.NET Web Api

I working with ASP.NET WEB API and jquery Date time.

My problem is : I want user to be able to select date using datepicker in the format of 'dd/MM/yyyy'. But when I configure my datepicker to do so (as done here) the date posted to the web api controller's action is '01/01/0001 00:00:00'. And the moment I removed the formatter of 'd/M/yy' from datepicker I am able to recieve the proper values, but the user sees date selected in MM/dd/yyyy.

I have set culture as 'en-GB' in my web.config as shown below...

<system.web>
<globalization culture="en-GB" uiCulture="en-GB"/>    
</system.web>

still this doesn't help.

I have recreated this scenario and uploaded the project here, if anybody wanted to give it a try.

My web-api controller looks like the one below

public class ValuesController : ApiController
{
    // POST api/values
    public void Post(ResponseModel model)
    {
        string culture = CultureInfo.CurrentCulture.DisplayName;
        if (model != null)
        {
            string name = model.Name;
            DateTime startDate = model.StartDate;
            DateTime endDate = model.StartDate;
        }
    }
}

and my View is below

    $(document).ready(function () {

    $("#startDate").datepicker({});
    $("#endDate").datepicker({});

//        $("#startDate").datepicker({ dateFormat: "dd/m/yy" });
//        $("#endDate").datepicker({ dateFormat: "dd/m/yy" });

    $("#submitBtn").bind("click", function () {

        var postData = {
        name: $("#fullName").val(),
        startDate: $("#startDate").val(),
        endDate: $("#endDate").val()
        };

        var jsonData = JSON.stringify(postData);
        console.log(jsonData);

        $.ajax({
        url: 'api/values/',
        type: 'POST',
        data: jsonData,
        contentType: "application/json;charset=utf-8",
        success: function (data) {
        }
        });
    });

    });

</script>

<div>
<p>
<b>Name : </b> <input type="text" id="fullName" />
</p>
<p>
<b>Start Date : </b> <input type="text" id="startDate" />
</p>
<p>
<b>End Date : </b> <input type="text" id="endDate" />
</p>
<input type="submit" value="Submit these values" id="submitBtn"/>
</div>

Please somebody help me on this.

So ultimately what I want is

Thanks

Upvotes: 2

Views: 4017

Answers (2)

Yasser Shaikh
Yasser Shaikh

Reputation: 47784

Changed my date time fields to string and then posted the date as string to my controller. Then in controller converted this string to date using DateTime.Parse()

Upvotes: 0

Regfor
Regfor

Reputation: 8091

Seems it's a typical problem with JSON dates.

Suppose, you have changed date format for date picker and it comes to Json incorrectly and thus is parsed incorrectly in Web API controller. Therefore, when you change date format in picker "by default", it all works.

Take a look at nice blog post about this problem

http://www.hanselman.com/blog/OnTheNightmareThatIsJSONDatesPlusJSONNETAndASPNETWebAPI.aspx

It should help.

Upvotes: 1

Related Questions