I was getting the error: TypeError: Cannot read property ‘sortable’ of undefined.

This was caused by dynamically changing Kendo UI grid columns, without destroying the grid first.

After I destroyed the grid and recreated it, the error was resolved.

To destroy a Kendo UI grid and later recreate it, use:

 

// Destroy kendo UI grid.
        // Must destroy and empty grid before refreshing columns.
        $('#crudGrid').data().kendoGrid.destroy();
        $('#crudGrid').empty();

        // Create Kendo UI grid.
        $('#crudGrid').kendoGrid({
            dataSource: {
                data: products,
                schema: {
                    model: {
                        fields: {
                            ProductName: { type: "string" },
                            UnitPrice: { type: "number" },
                            UnitsInStock: { type: "number" },
                            Discontinued: { type: "boolean" }
                        }
                    }
                },
                pageSize: 20
            },
            height: 430,
            scrollable: true,
            sortable: true,
            filterable: true,
            pageable: {
                input: true,
                numeric: false
            },
            columns: [
                "ProductName",
                { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "130px" },
                { field: "UnitsInStock", title: "Units In Stock", width: "130px" },
                { field: "Discontinued", width: "130px" }
            ]
        });

3 Comments

  1. Thank you so much! I’ve spent hours trying to debug this stupid error. I even manually removed everything that had to do with the .removeData() and was still getting this error.

    Travis
  2. Thanks this helped me lot but I loss toolbar template on using .empty(). I was already having grid I just wanted to setDatasource on change of dropdown field. Everything is working just I am loosing toolbar template. If there is any simple way to keep it retained please provide.

    Thanks

    Nadeem

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.