1. Home
  2. Forum
  3. ASP.NET MVC - EJ 2
  4. TimeSpan Issues on grid

TimeSpan Issues on grid

Hello,

I am having issues with displaying a time span on my grid. I am getting the [object][object] error as described here: https://www.syncfusion.com/kb/4106/how-to-bind-timespan-value-to-grid-column but it is showing {{value:Planned.Hours}} : {{value:Planned.Minutes}} as the value instead of converting. I am getting a javascript error "Uncaught TypeError: Cannot read property 'converters' of undefined". My grid code is:

@Html.EJS().Grid("CommandColumn").DataSource(dataManager => { dataManager.Url("/TripReport/ItemUrlDatasource?ID=" + Model.ID).InsertUrl("/TripReport/ItemInsert").UpdateUrl("/TripReport/ItemUpdate").RemoveUrl("/TripReport/ItemDelete").Adaptor("UrlAdaptor"); }).Columns(col =>
{
    col.Field("ID").HeaderText("ClassID").IsPrimaryKey(true).Width("120").Visible(false).AllowEditing(false).ValidationRules(new { required = true }).TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();

    col.Field("Planned").HeaderText("Planned").Width("500").Template("{{value:Planned.Hours}} : {{value:Planned.Minutes}}").Add();
}).Height("200").AllowPaging().EditSettings(edit => { edit.AllowAdding(true).AllowEditing(true).AllowDeleting(true); }).Toolbar(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" }).Render()

Please help! Let me know what addtional information you need

4 Replies 1 reply marked as answer
MH Matthew Hamlin June 1, 2020 07:08 PM UTC

Hello,

I have got it to display using the following code, but it will not pass the edited Timespan to the database.

<code>
@Html.EJS().Grid("CommandColumn").DataSource(dataManager => { dataManager.Url("/TripReport/ItemUrlDatasource?ID=" + Model.ID).InsertUrl("/TripReport/ItemInsert").UpdateUrl("/TripReport/ItemUpdate").RemoveUrl("/TripReport/ItemDelete").Adaptor("UrlAdaptor"); }).Columns(col =>
{
     col.Field("Planned").HeaderText("Planned").Width("150").Template("${formatTimeSpan(Planned)}").EditType("datetimepickeredit").Add();
}).Height("200").AllowPaging().EditSettings(edit => { edit.AllowAdding(true).AllowEditing(true).AllowDeleting(true); }).Toolbar(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" }).Render()


<script>
    function checkTime(i) {
        if (i < 10) {
            i = "0" + i;
        }
        return i;
    }

    function formatTimeSpan(Time) {
        return checkTime(Time.Hours) + ":" + checkTime(Time.Minutes);
    }
</script>
</code>

It just passes it as a 00:00:00 timespan. Any suggestions?

TS Thiyagu Subramani Syncfusion Team June 3, 2020 12:57 PM UTC

Hi Matthew, 

Thanks for contacting Syncfusion support. 

We can achieve your requirement by passing correct timespan string from client to server using actionBegin event. In this event we have passed timespan value from date Object. Please refer to the below code and sample link. 

   @Html.EJS().Grid("Grid").ActionBegin("begin").DataSource(ds => ds.Url("/Home/UrlDatasource").Adaptor("UrlAdaptor").InsertUrl("/Home/Insert").RemoveUrl("/Home/Remove").UpdateUrl("/Home/Update")).Columns(col => 
{ 
. . . . . . .  
    col.Field("OrderDate").HeaderText("Order Date").Template("${formatTimeSpan(OrderDate)}").Width("130").Type("dateTime").EditType("datetimepickeredit").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add(); 
    . . . . .   
 
}).Height("400").AllowPaging().Toolbar(new List<string> 
        () { "Add", "Edit", "Delete", "Update", "Cancel" }).AllowFiltering().FilterSettings(filter => filter.Type(Syncfusion.EJ2.Grids.FilterType.Menu)).EditSettings(edit => { edit.AllowEditing(true).AllowAdding(true).AllowDeleting(true); }).Render() 
</div> 
 
<script> 
    function begin(args) { 
        if (args.requestType === 'save') { 
            if (args.data.OrderDate != null) { 
                args.data.OrderDate = args.data.OrderDate.toTimeString().split(' ')[0]; 
            } 
        } 
    } 
    function checkTime(i) { 
        . . . . .  
    } 
 
    function formatTimeSpan(Time) { 
. . . . . .  
    } 
</script> 

Screenshot:  

 


Please get back to us, if you need any further assistance. 

Regards, 
Thiyagu S. 


Marked as answer
MH Matthew Hamlin June 3, 2020 01:09 PM UTC

Perefect! This seems to working great. I appreciate the help.

TS Thiyagu Subramani Syncfusion Team June 4, 2020 04:22 AM UTC

Hi Matthew, 

Thanks for the update. 

We are happy to hear that your issue is resolved. 

Please get back to us if you need further assistance. 

Regards, 
Thiyagu S. 


Loader.
Up arrow icon