Error in kendo.data.min.js when trying to update from grid

10 posts, 1 answers
  1. Lisa
    Lisa avatar
    35 posts
    Member since:
    May 2011

    Posted 18 Nov 2013 Link to this post

    Hi - I have a grid that I am doing batch updates on, and I'm getting an error as shown in the attached screen shot.  I'm not sure what I'm doing wrong?  The text of the error is "Uncaught TypeError: Cannot call method "call" of undefined.
    Thanks for any help.

    Lisa

    Here is my code:
    /**
     * This is a security dashboards controller
     */
    define([
        'wsipccontext',
        'jquery',
        'underscore',
        'utils/helpers',
        'utils/alerts',
        'kendoui/kendo.core.min',
        'kendoui/kendo.data.min',
        'kendoui/kendo.splitter.min',
        'kendoui/kendo.panelbar.min',
        'kendoui/kendo.grid.min'
     
    ], function (WSIPCContext, $, _, Helpers, Alerts, studentDetailTemplate) {
        //PRIVATE PROPERTIES
        var ksCharts, ksMain,
            kgSecurityGrid, ksChartsAndGrid, kpbContent,
            firstPass, nextRead, dsSchoolRiskFactors;
     
        //CONSTRUCTOR
        var init = function () {
            //ON DOC READY
            $(function () {
                initElements();
                onInitialLoad();
            });
        };
     
        var init1 = function () {
            //ON DOC READY
            $(function () {
                onInitialLoad();
            });
        };
     
        //EVENTS
        var initElements = function () {
            firstPass = true;
            nextRead = false;
     
     
            ksMain = $("#main").kendoSplitter({
                orientation: "horizontal",
                panes: [{
                    size: "240px",
                    collapsible: true,
                    scrollable: true
                }]
            }).data("kendoSplitter");
     
            kpbContent = $("#linkPanel").kendoPanelBar().data("kendoPanelBar");
            kpbContent.append([
                {
                    text: "Additional Dashboards",
                    content: "<a href='/DistrictEWSDashboard/'><img src='/assets/images/EWS District TN.png' />         <a href='/admindashboards/'><img src='/assets/images/EWS School TN.png' />         </a><a href='/StudentEWSDashboard/'><img src='/assets/images/EWS Student.png' />         </a><a href='/AdminDashboards.aspx/'><img src='/assets/images/Portal-big.png' /></a>"
                }
             ]);
     
            kpbContent = $("#panelBar").kendoPanelBar().data("kendoPanelBar");
            kpbContent.element.find("#comparativeDashboardPanelContents").css("height", "1104px");
     
            kpbContent.element.find("#gridPane").css("height", "770px");
     
            kpbContent.expand(kpbContent.element.find("li:first"));
     
            kgSecurityGrid = $("#securityGrid").kendoGrid({
                scrollable: true,
                columns: [
                        { field: "Username", title: "User Name", width: 150, editable: false },
                        { field: "FreeReduced", title: "Free and Reduced", width: 50 },
                        { field: "SpecEd", title: "Spec Ed", width: 60 },
                        { field: "Discipline", title: "Discipline", width: 50 },
                        { field: "Assessment", title: "Assessment", width: 50 },
                        { field: "Activities", title: "Activities", width: 50 },
                        { command: ["destroy"], title: " ", width: "172px" },
                        ],
     
                dataSource: {
                    transport: {
                        read: function (options) {
                            if (!(kgSecurityGrid)) {
                                options.success([]);
                                return;
                            }
                            kendo.ui.progress(kgSecurityGrid.element, true);
                            $.getJSON(Helpers.toServicesUrl("/GetctrlSecurityInfo"),
                                     {
                                         userName: WSIPCContext.UserName,
                                         districtId: WSIPCContext.DistrictId
                                     },
                                    function (data) {
                                        options.success([]);
                                        kgSecurityGrid.dataSource.data(data.GetctrlSecurityInfoResult.RootResults);
                                    }).always(function () {
                                        kendo.ui.progress(kgSecurityGrid.element, false);
                                    });
     
                        },
                        update: function (options) {
                            if (!(kgSecurityGrid)) {
                                //                            options.success([]);
                                //                            return;
                            }
                            kendo.ui.progress(kgSecurityGrid.element, true);
                            $.postJSON(Helpers.toServicesUrl("/GetupdateSecurityInfo"),
                                                             {
                                                                 userName: WSIPCContext.UserName,
                                                                 districtId: WSIPCContext.DistrictId,
                                                                 UserToUpdate: "wise\lhedman",
                                                                 Role: "Teacher",
                                                                 FnR: "yes",
                                                                 SpecEd: "yes",
                                                                 Assess: "yes",
                                                                 Discipline: "yes",
                                                                 Activites: "yes",
                                                                 MSDAdmin: "no"
                                                             },
                                                            function (data) {
                                                                options.success([]);
                                                                //                                    kgSecurityGrid.dataSource.data(data.GetupdateSecurityInfoResult.RootResults);
                                                            }).always(function () {
                                                                kendo.ui.progress(kgSecurityGrid.element, false);
                                                            });
     
    //                                                        type: "POST"
                        }
     
     
     
     
                    },
                    sort: {
                        field: "Username",
                        dir: "asc"
                    },
                    schema: {
                        model: {
                            fields: {
                                Username: { type: "string", editable: false },
                                FreeReduced: { type: "string" },
                                SpedEd: { type: "string" },
                                Discipline: { type: "string" },
                                Assessment: { type: "string" },
                                Activities: { type: "string" }
     
                            }
                        }
                    },
                    pageSize: 15,
                    batch: true,
                    page: 1
                },
                pageable: true,
                sortable: true,
                groupable: true,
                filterable: true,
                resizable: true,
                height: 760,
                toolbar: ["create", "save", "cancel"],
                editable: true
     
            }).data("kendoGrid");
     
            $("#applyFilters").css('display', 'none');
     
            kgSecurityGrid.dataSource.read();
     
        }; //end of initelements
     
        //ACTIONS
        var index = function () {
        };
     
        //  
     
     
        var visitNodes = function (nodes, callback) {
            for (var i = 0; i < nodes.length; i++) {
                callback(nodes[i]);
                if (nodes[i].hasChildren)
                    visitNodes(nodes[i].children.view(), callback)
            }
        };
     
        var eachItemToJSON = function (items) {
            var result = new Array(items.length);
            for (var i = 0; i < items.length; i++)
                result[i] = items[i].toJSON();
     
            return result;
        };
     
     
     
     
        function onInitialLoad() {
            //        $("#applyFilters").trigger("click");
     
        };
     
     
        //CALL CONSTRUCTOR
        init();
        //    init1();
     
        //PUBLIC PROPERTIES
        return {
            index: index
        };
    });


  2. Alexander Popov
    Admin
    Alexander Popov avatar
    1416 posts

    Posted 20 Nov 2013 Link to this post

    Hi Lisa,

    It is hard to say what exactly is causing this without a runnable project, however I noticed that the Model ID is not specified in the Schema. This usually makes it impossible for the DataSource to distinguish new items from existing ones. My guess here is that after you edit an item and press save the DataSource is actually calling the Create method (because no ID means new item), which is not defined. I also noticed that the toolbar has a "create" button, so I would recommend you to set a Model ID, as well as to define the Create function. If this does not solve the issue, then I would ask you to provide a runnable copy of you project. This will allow me to observe the issue locally and advise you further.

    Regards,
    Alexander Popov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Lisa
    Lisa avatar
    35 posts
    Member since:
    May 2011

    Posted 21 Nov 2013 Link to this post

    Thanks Alexander,

    Adding a model ID did solve my problem, I am now getting to my update code. 

    I'm not sure how to make it work correctly though.  We are using a SQL database, and have stored procedures that we are accessing for our reads, and I was trying to use a similar setup for the updates.  So, I have a stored procedure that I am using, but I'm having problems figuring out to code the functions to pass the data that I need to update in the database.  I am doing batch update on my grid.

    Specifically this code:
    update: function (options) {
        if (!(kgSecurityGrid)) {                        }
            kendo.ui.progress(kgSecurityGrid.element, true);
            $.getJSON(Helpers.toServicesUrl("/PostupdateSecurityInfo"),
             {
                  userName: WSIPCContext.UserName,
                  districtId: WSIPCContext.DistrictId,
                  UserToUpdate: "wise\lhedman",
                  Role: "Teacher",
                  FnR: "yes",
                  SpecEd: "yes",
                  Assess: "yes",
                  Discipline: "yes",
                  Activites: "yes",
                  MSDAdmin: "no"
            },
            function (data) {
                options.success([]);
            }).always(function () {
                 kendo.ui.progress(kgSecurityGrid.element, false);
            });
            type: "POST"
       }
    I of course don't want to send the hard-coded values I have in the example above as parameters, but am not sure what to send or how?

    Here is the code that calls the Stored Procedure, copied from what we are doing for our reads:
    public IList<updateSecurityInfo_Result> PostupdateSecurityInfo(string username, int? districtId, string UserToUpdate, string Role, string FnR, string SpecEd, string Assess, string Discipline, string Activites, string MSDAdmin)
     {
         return this.ObjectContext.updateSecurityInfo(username, districtId, UserToUpdate, Role, FnR, SpecEd, Assess, Discipline, Activites, MSDAdmin).ToList();
     }
    Thanks for any further help.

    Lisa









  5. Alexander Popov
    Admin
    Alexander Popov avatar
    1416 posts

    Posted 25 Nov 2013 Link to this post

    Hi Lisa,

    The Update method has a "options" parameter, which contains the data that should be sent to the server. Here is a small example, taken from the DataSource API reference:  
    update: function(options) {
      $.ajax({
        dataType: "jsonp", // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
        // send the updated data items as the "models" service parameter encoded in JSON
        data: {
          models: kendo.stringify(options.data.models) //the updated items
        },
        success: function(result) {
          // notify the data source that the request succeeded
          options.success(result);
        },
        error: function(result) {
          // notify the data source that the request failed
          options.error(result);
        }
      });


    Regards,
    Alexander Popov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Lisa
    Lisa avatar
    35 posts
    Member since:
    May 2011

    Posted 09 Dec 2013 Link to this post

    Hi Alexander, thanks for the reply.  I'm still not getting this right.  This is the first time I've had to update the database, and I'm not getting it. 

    So, I can set up the options parameter as shown in the example.  But I'm not sure how to access the data there.  I've attached a screen shot of what I see.  But I can't figure out how to get to the specific fields to send to my stored procedure?

    What I'm looking for is how, for example, I would get to the username.  This doesn't work, not sure what would.

    "options.data.models.Object.Username[0]"

    Thanks
    Lisa
  7. Alexander Popov
    Admin
    Alexander Popov avatar
    1416 posts

    Posted 11 Dec 2013 Link to this post

    Hello again Lisa,

    The models property is an array containing two objects, so if you want to access the Username of the first person you could do so like this: options.data.models[0].Username.

    Regards,
    Alexander Popov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  8. Answer
    Lisa
    Lisa avatar
    35 posts
    Member since:
    May 2011

    Posted 11 Dec 2013 Link to this post

    Thank you Alexander! 

  9. Srinivasan
    Srinivasan avatar
    4 posts
    Member since:
    Jan 2016

    Posted 22 Nov in reply to Alexander Popov Link to this post

    your reply solved my problem of updating datasource transport update call which was not firing even setting model ID in schema.

    Then I modified ID field in schema, like nullable : false. If nullable is set to true which expects create function which I don't want.

    ProductID: { type: "number", editable: false, nullable: false },
  10. Alexander Popov
    Admin
    Alexander Popov avatar
    1416 posts

    Posted 23 Nov Link to this post

    Hi Srinivasan,

    I am not sure I understand the scenario very well. Would you mind sharing a runnable Dojo sample?

    Regards,
    Alexander Popov
    Telerik by Progress
    Kendo UI is ready for Visual Studio 2017 RC! Learn more.
  11. Srinivasan
    Srinivasan avatar
    4 posts
    Member since:
    Jan 2016

    Posted 23 Nov in reply to Alexander Popov Link to this post

    Hi Alexander,

    I said your reply given to Lisa which is worked for me. There is no problem for me..

    Thanks for your quick response...

Back to Top
Kendo UI is VS 2017 Ready