KendoUI Grid' DataSource parametermap's data.sort array becomes undefined on 3rd column sort click

Question

I've got a datagrid configured as follows:

<script>
angular.module("KendoDemos", [ "kendo.directives" ]);
function MyCtrl($scope) {
    $scope.mainGridOptions = {
        dataSource: {

            transport: {
                read: {
                    url: "http://localhost:8090/rest/mycodeapi/Salesman?app_name=mycode&fields=FirstName%2C%20LastName&include_count=true",
                    dataType : 'jsonp',
                    type: 'GET',
                    beforeSend: function (req) {
                        req.setRequestHeader('Authorization', 'b3pilsnuhsppon2qmcmsf7uvj6')
                    }
                },
                parameterMap: function(data, type) {
                    if (type == "read") {
                        // send take as "$top" and skip as "$skip"
                        return {
                            order: data.sort[0]['field'] + ' ' + data.sort[0]['dir'],
                            limit: data.pageSize,
                            offset: data.skip
                        };
                    }
                }
            },
            schema: {
                data : 'record',
                total: 'meta.count'
            },
            pageSize: 5,
            serverPaging: true,
            serverSorting: true,
            sort: { field: "SalesmanID", dir: "asc" }
        },
        sortable: true,
        pageable: true,
        mobile: 'phone',
        columns: [{
            field: "FirstName",
            title: "First Name"
        },{
            field: "LastName",
            title: "Last Name"
        }]
    };

}
</script>

Problem is: on 1st click of the any column, say FirstName, it sorts by ascending order which is fine. On 2nd click it sorts by descending: still the expected behaviour. On the 3rd click however, nothing happens and the console reveals "Uncaught TypeError: Cannot read property 'field' of undefined ". This means something happens to the data.sort array after the 2nd consecutive click.

Would appreciate any pointers.

Answer 1

On third click the sorting is removed. You can modify your script like following:

 if (type == "read") {
   var params = {
       limit: data.pageSize,
       offset: data.skip
   };

   if (data.sort && data.sort.length > 0) 
     params.order = data.sort[0]['field'] + ' ' + data.sort[0]['dir'];

  return params;

 }

Answer 2

I know this is a bit late, but I was facing the same challenge, and this is what I did to resolve the issue.

Change

sortable: true,

to

sortable: {
    allowUnsort: false
},