Input string was not in a correct format

[Michael]

Going through and testing the Kendo grid functionality. I created a new Telerik project using the menu and grid template.

.NET Core 3.1

Telerik.UI.for.AspNetCore (2021.1.224)

VS 2019

I can get my test data to load on the grid no problem, however when ever I enter text in the search box, it gives an "Input string was not in a correct format" exception on the server side. I've noticed, that if a defined column is bound to a string typed property, the search filter works fine. But if I have a int (or DateTime for that matter) typed property, that's when I get the exception. For example, in my object I have an ApplicationId property. If I exclude it in the .Columns definition of the grid, everything works fine, however if I include it, that's when the ToDataSourceResultAsync() method seems to choke, and I get the exception. Probably something dumb, but I can't seem to find what I could be doing wrong.

Class:

public partial class Application
{
    public Application()
    {
        AppItems = new HashSet<AppItem>();
        AppVersions = new HashSet<AppVersion>();
    }

    [Display(Name = "Application ID")]
    public int ApplicationId { get; set; }

    [Display(Name = "Application Name")]
    [Required]
    public string AppName { get; set; }

    [Display(Name = "Description")]
    public string Description { get; set; }

    [Display(Name = "Added On")]
    public DateTime? AddedOn { get; set; }

    [Display(Name = "Added By")]
    public string AddedBy { get; set; }

    [Display(Name = "Updated On")]
    public DateTime? UpdatedOn { get; set; }

    [Display(Name = "Updated By")]
    public string UpdatedBy { get; set; }
    public virtual ICollection<AppItem> AppItems { get; set; }
    public virtual ICollection<AppVersion> AppVersions { get; set; }
}

Controller Method:

public async Task<IActionResult> GetApplications([DataSourceRequest]DataSourceRequest request)
{
    try
    {
        var apps = await _repo.GetApplicationsAsync();
        var result = await apps.ToDataSourceResultAsync(request);
        return Json(result);
    }
    catch (Exception e)
    {
        return Json("");
    }
}

Designer:

<div class="row">
    <div class="col-12">
        @(Html.Kendo().Grid<Application>()
            .Name("grdApplications")
            .Columns(columns =>
            {
                columns.Bound(p => p.ApplicationId).Title("ID");
                columns.Bound(p => p.AppName);
                columns.Bound(p => p.Description);
                //columns.Bound(p => p.AddedOn).Format("{0:MM/dd/yyyy}");
                columns.Bound(p => p.AddedBy);
                //columns.Bound(p => p.UpdatedOn).Format("{0:MM/dd/yyyy}");
                columns.Bound(p => p.UpdatedBy);
                columns.Command(command => { command.Edit().Text("Details"); command.Destroy(); }).Width(230);
            })
            .ToolBar(toolbar => { toolbar.Create().Text("Add New Application"); toolbar.Pdf(); toolbar.Excel(); toolbar.Search(); })
            .Editable(editable => editable.Mode(GridEditMode.PopUp))
            .Reorderable(reorderable => reorderable.Columns(true))
            .Pageable()
            .Sortable()
            .ColumnMenu()
            .Filterable()
            .Pageable(pageable => pageable.PageSizes(new int[] { 10, 25, 50, 100 }))
            .DataSource(dataSource => dataSource
                .Ajax()
                .Read(read => read.Action("GetApplications", "Applications"))
                .Create(create => create.Action("CreateApplication", "Applications"))
                .Update(update => update.Action("UpdateApplication", "Applications"))
                .Destroy(destroy => destroy.Action("DeleteApplication", "Applications"))
                .PageSize(10)
                .Model(model => {
                    model.Id(p => p.ApplicationId);
                    model.Field(p => p.ApplicationId).Editable(false);
                    model.Field(p => p.AddedOn).Editable(false);
                    model.Field(p => p.AddedBy).Editable(false);
                    model.Field(p => p.UpdatedOn).Editable(false);
                    model.Field(p => p.UpdatedBy).Editable(false);
                })
            )
        )
    </div>
</div>

[Michael]

I believe I found the answer, please ignore this

[Bill]

What is an answer? I've got same error!

[Michael]

Detailed under known issues in their documentation (Which I missed, at first) here:

https://docs.telerik.com/aspnet-core/html-helpers/data-management/grid/search-panel?_ga=2.31234296.615322369.1617307619-1217121827.1610481918&_gac=1.45804560.1614020023.EAIaIQobChMI5_PMjpX-7gIVA6GzCh0WawdMEAAYASAAEgJnP_D_BwE

"When the server operations are enabled, you can search only by using string fields. Using the Contains filter operation is available only for string types."

It is stating that the data types have to be strings. One could also use .ServerOperation(false) on the cshtml to have client side search only. If that is something that works for you.

Honestly, if ToDataSourceResultAsync() would handle the conversion error better, that would be splendid. As in, don't consider the search value if it can't be converted to the target type. On the surface, this doesn't seem all that difficult to do?

I'm wondering if there is a way to get the source code for the extension?

[Georgi Denchev]

Hello, Michael,

The recommended approaches to dealing with this issue are to either allow the Search Panel to use only string fields as shown in the documentation or to add properties which return the value as string.

public class Model 
{
    public DateTime MyDate {get;set;}
    public string MyDateString
    {
        get 
        {
            return this.MyDate.ToString();
        }
    }
}

Then you can bind the column to MyDate and use MyDateString in the search.

columns.Bound(c => c.MyDate);

.Search(s=> { s.Field(c => c.MyDateString); })

The Source Code for the wrappers is available for licensed users on the Downloads page of their profile.

Best Regards,
Georgi Denchev
Progress Telerik