[Solved] Cannot read property 'data' of undefined when calling Create operation on Grid

[Landon]

Hello, I am trying to get the create operation to work on this grid, but it is showing a "cannot read property 'data' of undefined" when I click "Update" in the popup editor.

 

 

 

 

 

 

 

// DATA SOURCE

 

var dataSource = new kendo.data.DataSource({

    transport: {

            read: {

                url: "GetSiteRoleCategoryInstances_Result_Read",

                data: {

                    userID: "24",

                    isCompletedFilter: false

                },

                create: {

                    url: "QT_CreateSRCI",

                    dataType: "json"

                },

                parameterMap: function (options, operation) {

                    if (operation !== "read" && options.models) {

                        console.log(operation)

                        console.log(options.models)

                        return { models: kendo.stringify(options.models) };

                    }

                     

                }

            }

    },

    batch: true,

    schema: {

        model: {

                id: "SrciID",

                fields: {

                    SrciID: { editable: false, nullable: true },

                    FK_SiteRoleCategory_ReqID: { type: "number" },

                    ReviewName: { type: "string"},

                    InstanceName: { type: "string" },

                    StartDate: { type: "date" },

                    DueDate: { type: "date" },

                    InspectionReport: { type: "string" },

                    InspectionReportDate: { type: "date" },

                    Note: { type: "string" },

                    CreatedDate: { type: "date" },

                    CreatedBy: { type: "string" },

                    RequiredNumber: { type: "number" },

                    IsCompleted: { type: "bool" }

                }

            }

        },

    })

 

 

// Grid

 

$("#reviewGrid").kendoGrid({
        dataSource: dataSource,

        columns: [
            { field: "FK_SiteRoleCategory_ReqID"},
                {
                    field: "ReviewName",
                    title: "Review Name",
                    editor: src_rDropDownEditor,
                    width: 400
                },
                { field: "InstanceName" },
                { field: "StartDate", title: "Start Date", type: "datetime", format: "{0:MM/dd/yyyy}" },
                { field: "DueDate", title: "Due Date", type: "date", format: "{0:MM/dd/yyyy}" },
                { field: "InspectionReport" },
                { field: "InspectionReportDate", title: "Last Inspection Date", type: "date", format: "{0:MM/dd/yyyy}" },
                { field: "Note" },
                { field: "CreatedDate", title: "Created Date", type: "date", format: "{0:MM/dd/yyyy}" },
                { field: "CreatedBy" },

                { field: "RequiredNumber" },
                { field: "IsCompleted"}
                //{command: [ "edit" , "destroy"], width: 180 }
            ],
            //toolbar: ["create", "pdf"],

            //serverPaging: true,
            //serverSorting: true,
            //serverSorting: true,

        editable: "popup",
        sortable: {
            mode: "single"
        },
        toolbar: ["create"],
        detailExpand: function onDetailExpand(e) {
            //Implement the event handler for detailExpand
            DetailExpandEvent(e);
        },
        // detailCollapse: function onDetailCollapse(e) {
        //Implement the event handler for detailCollapse
        //  },
        //change: onChange,
        scrollable: false,
        resizable: true,
        selectable: true,
        detailTemplate: kendo.template($("#kDetailsTemplate").html()),
        detailInit: DetailInit,
        dataBound: GridDataBind,
        autoBind: true,
        autoSync: true,
        serverOperation: false
    });

 

// CUSTOM EDITOR FOR ReviewName

function src_rDropDownEditor(container, options) {

    console.log(container)
    console.log(options)
    $('<input data-bind="value:' + options.field + '"/>')
      .appendTo(container)
      .kendoDropDownList({
          dataTextField: "ReviewName",
          dataValueField: "ID",
          dataSource: src_rDs
      });
}

 

Any idea as to why am I getting this error?

[Stefan]

Hello, Landon,

Thank you for the code.

After inspecting the code I noticed that the create is nested inside the read:

var dataSource = new kendo.data.DataSource({

    transport: {

            read: { // read open

                url: "GetSiteRoleCategoryInstances_Result_Read",

                data: {

                    userID: "24",

                    isCompletedFilter: false

                },

                create: {

                    url: "QT_CreateSRCI",

                    dataType: "json"

                },
}// Read close

Also, autoSync and server operation are options of the dataSource, but they are placed inside the Grid configuration:

https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/configuration/autosync

If the issue still exists, please provide an example reproducing it as it could be caused by a factor which we are overlooking at this moment.

Regards,
Stefan
Progress Telerik

[Landon]

Oh wow, can't believe it was a simple missed closing bracket...

 

thank you for your help stefan!