[Solved] Dynamic Columns Won't Show DateTime/Number Filter Operators

[Shoji Kaburagi]

Hello,

I create kendoGrid with the data I received from an web site. The thing is that the column names and column types are unknown until I receive data. Everything else works OK except for Date/Time and Number fields, filter operators are those for string fields (the dropdown does not show greater than or less than, but it shows contains, etc..). The code is below. I checked the type value for the Date/Time field and it is date. Date values are correctly converted date value and I confirmed the format as "{0:MM/dd/yyyy HH:mm:ss}". It still does not show correct filter operators. Do you have any idea as to what is wrong with it?


            var dataSource =searchResult.Result;
            if (!dataSource) {
                dataSource = [];
            }

            $.each(dataSource, function (index, row) {
                if (searchResult && searchResult.Columns) {
                    for (var i = 0; i < searchResult.Columns.length; i++) {
                        var column = searchResult.Columns[i];
                        var jsonDate = row[column.FieldName];
                        if (jsonDate && jsonDate.toString().indexOf("/Date(") > -1) {
                            jsonDate = new Date(parseInt(jsonDate.substr(6)));
                            row[column.FieldName] = jsonDate;
                        }
                    }
                }
            });
            var dataFields = [];
            if (searchResult && searchResult.Columns) {
                for (var i = 0; i < searchResult.Columns.length; i++) {
                    var column = searchResult.Columns[i];
                    dataFields[column.FieldName] = { type: column.Type };
                }
            }

            dataModel = kendo.data.Model.define({
                fields: dataFields
            });

    var columns=[];
    if (searchResult.Columns) {
        for (var i = 0; i < length; i++) {
            var model = searchResult.Columns[i];
            columns[i] = { field: model.FieldName, format: model.Format, title: model.Title, width: "150px" };
        }
    }
 $("#grid").kendoGrid({
        dataSource: {
            data: dataSource,
            schema: {
                model: dataModel
            }
        },
        height: 550,
        sortable: true,
        resizable: true,
        pageable: { pageSize: 15 },
        groupable: true,
        reorderable: true,
        detailInit: onDetailInit,
        detailExpand: onDetailExpanded,
        filterable: true,
        columnMenu: true,
        mobile: true,
        change: rowChanged,
        columns: columns,
        selectable: true });

Thanks for your help!

[Shoji Kaburagi]

I figured it out.

I should have initialized the JSON objects for fields in the schema as an object, not as an array. 

So instead of:
var dataFields = [];

Do:

var dataFields = {};

and now it all works.


Thanks.