Time Editor In Grid Not Functioning Correctly

7 posts, 1 answers
  1. Reafidy
    Reafidy avatar
    18 posts
    Member since:
    Sep 2014

    Posted 08 Jul Link to this post

    Please refer to the screen cast link below.  During inline editing when the time column is clicked to begin editing the existing time is cleared.  Also after the time and then entering the am pm designator the time is cleared and the editor closes.  Entering a time is actually only possible when the DateTime model property is marked as nullable otherwise a validation error is thrown.  (All in the video)

    Grid:

    @(Html.Kendo().Grid<Aero.Models.Leg>()
        .Name("grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.FlightID);    
            columns.Bound(p => p.Origin);
            columns.Bound(p => p.Destination);
            columns.Bound(p => p.Start); 
            columns.Bound(p => p.TakeOff);
            columns.Bound(p => p.Landing);
            columns.Bound(p => p.Stop);
        })
        .ToolBar(toolBar =>
        {
            toolBar.Save();
            toolBar.Create();
        })
        .Editable(editable => editable.Mode(GridEditMode.InCell))
        .Scrollable()
        .Resizable(resize => resize.Columns(true))
        .HtmlAttributes(new { style = "height:430px;" })
        .DataSource(dataSource => dataSource
            .Ajax()
            .Batch(true)
            .PageSize(20)
            .ServerOperation(false)  
            .Model(model =>
            {
                model.Id(p => p.LegID);
                model.Field(p => p.LegID).Editable(false);         
            })
            .Read(read => read.Action("Legs_Read", "Test", new {  id = Model.FlightID }))
            .Update(update => update.Action("Legs_Update", "Test"))
            //.Create(create => create.Action("ForeignKeyColumn_Create", "Grid"))
            //.Destroy(destroy => destroy.Action("ForeignKeyColumn_Destroy", "Grid"))
        ).Deferred()
    )

     

    Model:

       public class Leg

        {
            public int LegID { get; set; }

            [DataType(DataType.Time)]     
            public DateTime? Start { get; set; }

            [DataType(DataType.Time)]  
            public DateTime? Stop { get; set; }

            [DataType(DataType.Time)]
             public DateTime TakeOff { get; set; }

            [DataType(DataType.Time)]       
            public DateTime Landing { get; set; } 

            public string Origin { get; set; }
            public string Destination { get; set; }

            public string Notes { get; set; }

            [Display(Name = "Flight")]
            public int? FlightID { get; set; }
            public virtual Flight Flight { get; set; }
        }

    https://screencast-o-matic.com/watch/cbiQc1lbrz

  2. Tsvetina
    Admin
    Tsvetina avatar
    2087 posts

    Posted 12 Jul Link to this post

    Hi,

    The cause of this issue is explained in this thread:
    asp mvc EditorFor DateTime not displaying

    One option is to create a custom EditorTemplate for Time fields using the TimePicker widget. If you open the local ASP.NET Core demos, you will find examples of editor templates for different types of fields in the Views/Shared/EditorTemplates folder.
    If you create a TimePicker and ensure that cultures are set to match between the client and server, like shown in this demo, you should not have problems with editing dates/times.

    Regards,
    Tsvetina
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Reafidy
    Reafidy avatar
    18 posts
    Member since:
    Sep 2014

    Posted 05 Aug Link to this post

    Event when I ensured the cultural settings where matched between client and server there was still an issue.  

    I believe the error was in Telerik's cultural file for New Zealand:  kendo.culture.en-NZ.min.js

    I had to modify the file from this format:

    AM:["a.m.","a.m.","A.M."],PM:["p.m.","p.m.","P.M."]

    To this format:

    AM:["AM","am","AM"],PM:["PM","pm","PM"]

    This now matches the default cultural settings for New Zealand on Windows 10 which is different to previous versions.

  4. Tsvetina
    Admin
    Tsvetina avatar
    2087 posts

    Posted 09 Aug Link to this post

    Hi Reafidy,

    To avoid having to manually modify culture files if they differ between Windows versions, you can use the Culture Helper API to generate the culture scripts dynamically, based on the OS info:
    Use the Culture Helper

    Regards,
    Tsvetina
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Reafidy
    Reafidy avatar
    18 posts
    Member since:
    Sep 2014

    Posted 10 Aug in reply to Tsvetina Link to this post

    The culture helper does not appear to be implemented in the  UI for asp.net core framework.
  6. Answer
    Tsvetina
    Admin
    Tsvetina avatar
    2087 posts

    Posted 11 Aug Link to this post

    Hello Reafidy,

    Indeed, you are right. The Culture helper is not yet available for ASP.NET Core, so updating the culture files should be done manually or by running the Culture Helper in an MVC project and copying the result.
    Sorry for the misleading information.

    Regards,
    Tsvetina
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  7. Reafidy
    Reafidy avatar
    18 posts
    Member since:
    Sep 2014

    Posted 11 Aug Link to this post

    Cool, thanks for the help.
Back to Top