Question

I have a custom editor template for a vehicle part that is used in a telerik grid for insertion in mvc3 razor. The editor template includes a datetime field. On insertion of a new vehicle part the datetime field is incorrect and the format is changed.

For example, if I insert “06/10/2011” which is day 6 , month 10 and year 2011 , in the controller, the dateTime field in the model is “10/06/2011” which is day 10 month 6 and year 211. I am using telerik’s date picker

Basically the day and month are becoming switched after submitting to the controller

I have other instances in my code where I am passing a datetime field without an issue, so I believe the problem is the fact that I’m using a custom editor template …

Here is the code for the grid:

@(Html.Telerik().Grid<VehiclePartsViewModel>()
    .Name("VehiclePartsViewModel")
    .ToolBar(commands => 
    {   commands.Insert();
    })
    .DataKeys(keys => keys.Add(c => c.Id))
    .ClientEvents(events => events.OnRowDataBound("onRowDataBound"))
    .DataBinding(dataBinding => dataBinding
        .Ajax()
            .Insert(MVC.Vehicles.CustomCoverage._InsertPart().GetRouteValueDictionary())
            .Select(MVC.Vehicles.CustomCoverage._SelectPart().GetRouteValueDictionary())
            .Update(MVC.Vehicles.CustomCoverage._SavePart().GetRouteValueDictionary())
            .Delete(MVC.Vehicles.CustomCoverage._DeletePart().GetRouteValueDictionary())
        )
    .Columns(columns =>
    {
        omitted..
    })
    .Footer(false)
    .Editable(editing => editing.Mode(GridEditMode.PopUp))

The simplified editor template is :

<div>
    @Html.LabelFor(v => v.ItemId, new { @class = "uc-caption"}) &nbsp;
    @Html.EditorFor(v => v.ItemId)
</div><br />
<div>
    @Html.LabelFor(v => v.InstallDate, new { @class = "uc-caption"}) &nbsp;
    @Html.EditorFor(v => v.InstallDate, new { Modifiable = true })
</div>

I am also using an editor template for dateTime, but I do not believe the issue is here:

@( 
    Html.Telerik().DatePicker()
    .Name(ViewData.TemplateInfo.GetFullHtmlFieldName(string.Empty))
    .HtmlAttributes(new { id = ViewData.TemplateInfo.GetFullHtmlFieldName(string.Empty) + "_wrapper" })
    .ShowButton(true)
    .Value(Model.HasValue ? Model.Value : new DateTime())
    .ClientEvents(events => events.OnChange("onChangeDatePicker"))
    .InputHtmlAttributes(new { style = "width:100%"})
    .Enable(ViewData["Modifiable"] != null ? (bool)ViewData["Modifiable"] : true)

)

Thanks

Answer 1

Ok so I was finally able to resolve this with telerik .. there seems to be a problem with setting globalization to true .. You have to add a line before it .. This is what my _layout.cshtml looks like now ..

@(Html.Telerik().ScriptRegistrar()
        .OnDocumentReady(@<text></text>) //Telerik: This is required because there is still no Telerik components on the page and jQuery(document).ready will not be rendered and the globalization will not work
        .Globalization(true)