Issue with serverside filtering datetime kendo ui

Question

I have a problem with the serverside filtering of datetimes with a DataSourceRequest..

I have a grid in my ShowProcesses.cshtml. I construct that kendo ui grid through javascript. I turned serverFiltering and serverSorting on. It looks like this (I kicked everything you don't need to see/know):

        $("#processGrid").kendoGrid({
            sortable: true,
            pageable: true,
            selectable: true,
            filterable: {
                extra: false
            },
            dataSource: {
                type: "aspnetmvc-ajax",
                transport: {
                    read: {
                        url: "/Home/GetProcesses",
                        cache: false,
                        type: "POST",
                        dataType: "json"
                    },
                    parameterMap: function (data) {
                        return $.extend({}, data, { sort: data.sort, filter: data.filter });
                    }
                },
                serverPaging: true,
                serverFiltering: true,
                serverSorting: true,
                page: "@ViewBag.ProcessPage",
                schema: { data: "Data", total: "Total", model: { id: "Id" } },
                pageSize: "@(@Model.MaxCountToShow)"
            },
            columns: [
                { field: "ErrorDateTime", title: "ProcessDateTime", width: "170px"/*, filterable: { ui: dateFilter }*/ },
                { field: "Name", title: "Processtype", attributes: { value: "type" }, width: "240px;", filterable: { ui: processtypeFilter} },
                { field: "Service", title: "Service", width: "181px;", filterable: { ui: serviceFilter } },
                { field: "Operation", title: "Operation", width: "130px", filterable: { ui: operationFilter } }
            ]
        }).data("kendoGrid");

One column of this kendo ui grid contains datetimes (title: ProcessDateTime, field: ErrorDateTime). This column can be filtered. /Home/GetProcesses looks like this:

    public JsonResult GetProcesses([DataSourceRequest] DataSourceRequest request)
    {
      var result = homeModel.HomeModelGrid.ToDataSourceResult(request, p => new
        {
            Id = p.Id,
            ProcessDateTime = p.ProcessDateTime != null ? p.ProcessDateTime.ToString() : "",
            State = p.State,
            StateDetails = p.StateDetails != null ? p.StateDetails : "",
            Name = p.Name,
            Service = p.Service,
            Operation = p.Operation,
            ErrorDateTime = p.State == "Successful" || p.State == "Info" || p.State == "Warning" ? (p.ProcessDateTime != null ? p.ProcessDateTime.ToString() : "") : p.ErrorDateTime.ToString()

        });

        return new JsonResult { Data = result, JsonRequestBehavior = JsonRequestBehavior.AllowGet, MaxJsonLength = Int32.MaxValue };
    }

The DataSourceRequest request contains Filters, Sorts, Data, Page, PageSize, etc. The Filters are either of type FilterDescriptor or CompositeFilterDescriptor. The HomeModelGrid is a view which contains the columns that are used to create the result.

If I try to filter the ProcessDateTime column (you enter a date in a textbox), I get the following error: An exception of type 'System.ArgumentException' occurred in Kendo.Mvc.dll but was not handled in user code; Additional information: Provided expression should have string type

I read a post where one guy suggested to set the MemberType of the FilterDescriptor to string. I tried it and got this error: An exception of type 'System.InvalidOperationException' occurred in System.Core.dll but was not handled in user code; Additional information: No coercion operator is defined between types 'System.DateTime' and 'System.String'.

So, it tried to convert the string to a datetime. Therefore, I set the MemberType of the FilterDescriptor to DateTime and got the following error: An exception of type 'System.ArgumentException' occurred in Kendo.Mvc.dll but was not handled in user code; Additional information: Provided expression should have string type

As I read this, I looked up the value that the Filterdescriptor was using for filtering. It was a string. I changed the Value of the FilterDescriptor to a DateTime and got this error: An exception of type 'System.ArgumentException' occurred in Kendo.Mvc.dll but was not handled in user code; Additional information: Provided expression should have string type

I got this one before.. I really don't know what to do.

The FilterDescriptor looks like this after changing the MemberType and converting the string to a datetime:

FilterDescriptor: 
  ConvertedValue: {03.11.2014 00:00:00}
  Member:  "ErrorDateTime"
  MemberType: {Name="DateTime" FullName="System.DateTime"}
  Operator: StartsWith
  Value: {03.11.2014 00:00:00}

Before, it looked like this:

FilterDescriptor: 
  ConvertedValue: "3.11.2014"
  Member:  "ErrorDateTime"
  MemberType: null
  Operator: "StartsWith"
  Value: "3.11.2014"

I really don't know how I can make it work. I appreciate any insights. Thanks and Ciao

Melanie Melanie · Accepted Answer · 2014-12-10T08:59:42

I found a solution to this problem.

I added a function to the data of the ajax call. There, I iterate over the filters and fetch the one that contains the date. I change its value so I can use it in my controller. Either you can use :

kendo.toString(new Date(filters[m].value), "dd.MM.yyyy")

Or:

//this is in the *data: function(){}* of the ajax call
var newout = reformDate(filters[m].value.toString());

//function which formats the date
function reformDate(input){
    var year = input.slice(-4),
        month = ['Jan','Feb','Mar','Apr','May','Jun',
                 'Jul','Aug','Sep','Oct','Nov','Dec'].indexOf(input.substr(4,3))+1,
       day = input.substr(8,2);

    var output = (day<10?'0':'') + day.trim() + '.' 
                   + (month<10?'0':'') + month + '.' + year;
    return output;
}

The string has then the format : dd.MM.yyyy

In the controller, I can convert it to a date and use it to filter the model

Issue with serverside filtering datetime kendo ui

1 Answers