Kendo grid not loading data in MVVM

261 views Asked by At

Data not being loaded in kendo ui grid, this is MVC project and url of read is returning proper object array in json format. There is no error in console but no grid visible on page.

        $(document).ready(function () {
        var viewModel = kendo.observable(
            {
                isVisible: true,
                Professions: new kendo.data.DataSource({
                    schema: {
                        model: {
                            id: "ProfessionKey"
                        }
                    },
                    batch: true,
                    transport: {
                        read: {
                            url: "Default/GetAllProfessionsJson",
                            dataType: "Json"
                        },
                        parameterMap: function (options, operation) {
                            if (operation !== "read" && options.models) {
                                return { models: kendo.stringify(options.models) };
                            }
                        }
                    }
                })
            }
        );
        kendo.bind($("#grid"), viewModel);
    });

and html is

<div data-role="grid"
 data-toolbar="['create', 'save']"
 data-columns='["ProfessionKey", ProfessionEnglish", "ProfessionFrench", "ProfessionGerman"]'
 data-bind="source: Professions">
</div>

and following files are referenced

<link href="@Url.Content("~/Content/kendo/2012.2.710/kendo.common.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2012.2.710/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2012.2.710/kendo.default.min.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/kendo/2012.2.710/jquery.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo/2012.2.710/kendo.all.min.js")"></script>
<script src="@Url.Content("~/Scripts/angular.min.js")"></script>
1

There are 1 answers

0
Adeem On

Scope of var viewModel should be global/outside the function.