We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

Passing TimeSpan Value to Entity

Thread ID:

Created:

Updated:

Platform:

Replies:

124401 Jun 7,2016 10:33 AM Jun 9,2016 12:22 AM ASP.NET MVC 3
loading
Tags: Grid
Arthur
Asked On June 7, 2016 10:33 AM

Hello,

how can i save a TimeSpan Value in a Grid-Column and send it to Server?

Ragavee U S [Syncfusion]
Replied On June 8, 2016 07:34 AM

Hi Arthur, 

Thanks for your interest in Syncfusion products. 

We analyzed your requirement to bind TimeSpan column to grid and update the modified value to server. We have already discussed on “Binding TimeSpan value to Grid columns” in the below knowledge base link.  


We have achieved your requirement using the Column Template and EditTemplate feature of the Grid.  



Please refer to the below code example. 

<script type="text/javascript"> 
    $.views.converters("value", function(val) { 
    return ej.globalize.format(val,"D2");//get the formatted value 
    }); 
</script> 
 
<div style="margin:30px"> 
    @(Html.EJ().Grid<object>("Grid") 
            .Datasource(d=>d.Json((IEnumerable<object>)ViewBag.data).InsertURL("/Home/Insert").UpdateURL("/Home/Update").RemoveURL("/Home/Delete").Adaptor(AdaptorType.RemoteSaveAdaptor))             
            . . . . 
           .Columns(col => 
            { 
                col.Field("Id").HeaderText("ID").IsPrimaryKey(true).TextAlign(TextAlign.Right).Add(); 
                col.Field("TestColumn").Add(); 
                col.Field("Time").HeaderText("Time").EditTemplate(editTemp=>editTemp.Create("create").Write("write").Read("read")).Template("{{:Time.Hours}} : {{value:Time.Minutes}} : {{value:Time.Seconds}}").Add();//show the timespan value using template property; Time property will be obtained as complex object. 
            })   
            .ClientSideEvents(eve=>eve.Create("onGridCreate"))             
    ) 
</div> 
 
<script type="text/javascript"> 
    function onGridCreate(args) { 
        this.model.columns[2].allowEditing = true; //if the column index is undefined, you can get the column object using the getColumnByField or getColumnByHeaderText method and thus update this property. 
    } 
    function create(args) { 
        return $("<input>"); 
    } 
    function write(args) { 
        //convert the element to ejTimePicker control 
        args.element.ejTimePicker({ 
            value: args.rowdata["Time"], 
            interval: 15, 
            timeFormat: "HH:mm:ss", 
            width: "100%" 
        }); 
    } 
    function read(args) { 
        return args.ejTimePicker("getValue");//get the value from the TimePicker control 
    } 
</script> 

We have prepared a sample with the above solution, which can be downloaded from the below location. 


Regards, 
Ragavee U S. 


Arthur
Replied On June 8, 2016 09:52 AM

Thanks, its working fine!:)

Ragavee U S [Syncfusion]
Replied On June 9, 2016 12:22 AM

Hi Arthur, 

  

Thanks for your update. 

  

We are happy that your requirement is achieved. 

  

Regards, 

Ragavee U S. 

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;