Как заставить сортировку работать правильно в Kendo ui в случае пустых полей в Grid / Hierarchical Grid?

В случае сетки кэндо есть случай, когда сетка заполнена пустыми полями, как показано на рисунке. Сортировка в этом случае изменяется и ведет себя не так, как ожидалось. У меня проблема с пустыми полями. Те должны прийти в первый или в последний раз, пока сортируются, но они приходят то здесь, то там. Есть идеи, как это преодолеть?

Вот что я пытался сделать до сих пор: 

$(document).ready(function() {
    $("#grid").kendoGrid({
        dataSource: {
            data: [
                { FirstName: 'Alphy', NumberColumn: 10},
                { FirstName: 'Betty', NumberColumn: 5},
                { FirstName: 'Ashish', NumberColumn: ""},
                { FirstName: 'Carlos', NumberColumn: -61},
                { FirstName: 'zebra', NumberColumn: -7},
                { FirstName: 'Ketty', NumberColumn: 5},
                { FirstName: 'alpha', NumberColumn: ""},
                { FirstName: 'Loren', NumberColumn: 5},
                { FirstName: 'Brian', NumberColumn: 5}
            ]
        },
        sortable: {
            mode: "single",
            allowUnsort: false
        },
        columns: [
            {
                field: "FirstName",
                title: "First Name"
            },
            {
                field: "NumberColumn",
                title: "Number Column"
            }
        ]
    });
});
<link href="http://cdn.kendostatic.com/2015.2.624/styles/kendo.material.min.css" rel="stylesheet" />
<link href="http://cdn.kendostatic.com/2015.2.624/styles/kendo.common-material.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2015.2.624/js/kendo.all.min.js"></script>

<div id="grid"></div>

Нажмите здесь для JS Fiddle для приведенного выше кода

1 2
kendo-ui kendo-grid

1 ответ:

Сортировка выглядит как ошибка, потому что вы отправляете empty string ("") в свою сетку. И вы не можете сравнить int с string в этом случае.

Вам нужно отправить null значение, чтобы заставить его работать правильно.

2 возможные пути:

1) Это можно сделать, изменив источник данных следующим образом: 

{ FirstName: 'Alphy', NumberColumn: 10},
{ FirstName: 'Betty', NumberColumn: 5},
{ FirstName: 'Ashish', NumberColumn: null},
{ FirstName: 'Carlos', NumberColumn: -61},
{ FirstName: 'zebra', NumberColumn: -7},
{ FirstName: 'Ketty', NumberColumn: 5},
{ FirstName: 'alpha', NumberColumn: null},
{ FirstName: 'Loren', NumberColumn: 5},
{ FirstName: 'Brian', NumberColumn: 5}

JSFiddle: http://jsfiddle.net/ghorg12110/pwmtzq81/6/

2) Вы можете изменить свои данные в schema: 

data: [
    { FirstName: 'Alphy', NumberColumn: 10},
    { FirstName: 'Betty', NumberColumn: 5},
    { FirstName: 'Ashish', NumberColumn: ""},
    { FirstName: 'Carlos', NumberColumn: -61},
    { FirstName: 'zebra', NumberColumn: -7},
    { FirstName: 'Ketty', NumberColumn: 5},
    { FirstName: 'alpha', NumberColumn: ""},
    { FirstName: 'Loren', NumberColumn: 5},
    { FirstName: 'Brian', NumberColumn: 5}
],
schema: {
    data: function (response) {
        for (var i = 0; i < response.length; i++) {
            if (response[i].NumberColumn === "") {
                response[i].NumberColumn = null;
            }
        }
        return response;
    }
}

JSFiddle: http://jsfiddle.net/ghorg12110/pwmtzq81/7/

1