kendo.Data.Model instance in a HierarchicalDataSource for bindng TreeView

[Stefan Söderberg]

Hi, I am having problems using an instance of a kendo.Data.Model in a HierarchicalDataSource.

I tried this simple model for a folder object:

var folderModel = kendo.data.Model.define({
    id: "Id",
    hasChildren: "HasChildren",
    children: "Children",
    fields: {
        Id: { editable: false, nullable: true },
        Name: { validation: { required: true} },
        ParentFolderId: { editable: false, nullable: true }
    }
});

Then created a simple data source using that as the model:

var folderStore = new kendo.data.HierarchicalDataSource({
    transport: {
        read: {
            url: "/Folders/",
            dataType: "json",
            type: "POST"
        },
    },
    schema: {
        model: folderModel
    }
});

The datasource is then used to bind a TreeView.

$(function () {
    $("#folderTreeView").kendoTreeView({
        dataSource: folderStore,
        dataTextField: ["Name"]
    });
});

This fails and the treeview is not bound.

However, it does work if I use an inline approach when defining the datasource:

var folderStore = new kendo.data.HierarchicalDataSource({
    transport: {
        read: {
            url: "/Folders/",
            dataType: "json",
            type: "POST"
        },
    },
    schema: {
        model: {
            id: "Id",
            children: "Children",
            hasChildren: "HasChildren"
        }
    }
});

Even if I simplify the model down to:

var folderModel = kendo.data.Model.define({
    id: "Id",
    children: "Children",
    hasChildren: "HasChildren"
});

I cannot use it in the datasource.

Must be missing something here, please advice. Would like to use the model for CRUD operations elsewhere and want to use the same model in the treeview.

[Daniel]

Hello,

The HierarchicalDataSource uses kendo.data.Node which extends kendo.data.Model so it should be used in this case:

var folderModel = kendo.data.Node.define({
    id: "Id",
    hasChildren: "HasChildren",
    children: "Children",
    fields: {
        Id: { editable: false, nullable: true },
        Name: { validation: { required: true} },
        ParentFolderId: { editable: false, nullable: true }
    }
});

Regards,
Daniel
the Telerik team