update and insert in kendoGrid with JayData and angular

[mary1987]

i tried to use kendo grid by crud Operation that cooperate with Jaydata and angularjs to create DataSource and implement crud Operation.but when i update or create a record after submit on server i have an error in kendo.js of jayadataModules.because the save funcion of entity in angular(in jaydataModules)return promise object that contains catch,finaly,then function and doen't have fail function.

here is my jaydata context:

   (function(global, $data, undefined) {
         $data.Entity.extend('ComplexEntity', {
               'Name': { 'type': 'Edm.String' },
               'Created': { 'type': 'Edm.DateTime', 'nullable': false, 'required': false },
               'Index': {'key':true,'computed': true, 'type': 'Edm.Int32', 'nullable': false, 'required': true },
               'LargeNum': { 'type': 'Edm.Int64', 'nullable': false, 'required': true }
       });
     $data.generatedContexts = $data.generatedContexts || [];
     $data.generatedContexts.push(TestContext.Container);
})(window, $data);

app.js:

       var app = angular.module('app', ['jaydata']);

DataSource.js:

         app.factory('dataSource', ['$data', function ( $data) {
             return {
               get: function (serviceUri) {
               debugger;
               var context = new $data.initService(serviceUri);
               return context;
                   }
            };
        }]);

grid-directive.js:

    app.directive('crudGrid', function () {
          return {
                      restrict: 'A',
                      scope:{
                              ds:'=',
                           },
                     controller: function ($scope,$element,$attrs, $data, dataSource) {
                         serviceUri = '/odata';
                          var tag = $element;
                          var context = dataSource.get(serviceUri);
                         context.then(function (db) {
                                  ds = db.ComplexEntity.asKendoDataSource();
                                 kendo.init($("#" + tag[0].id));
                          }).fail(function (args) {
           //some code here 
                         });
               }
             }
        });

ComplexEntityController:

           public class ComplexEntityController :ODataController
             {
                  [Queryable]
                 public IQueryable<ComplexEntity> Get(ODataQueryOptions<ComplexEntity> options)
                     {
                        return complexList.AsQueryable();
                     }

                public HttpResponseMessage Post(ComplexEntity entity)
                   {
                       if (ModelState.IsValid)
                        {
                            // some code here 
                      return Request.CreateResponse<ComplexEntity>(entity);
                             }
                       else
                          return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ModelState);
    }

     public ComplexEntity Patch(int key, Delta<ComplexEntity> patch)
    {
        var entity = complexList.First(t => t.Index == key);

        patch.Patch(entity);

        return entity;

    }

}

when i update record i have an error:'undefined is not a function' on kendo.js at this line :

    model[0].innerInstance().save().then(function (item) {
                            options.success();
                        }).fail(function () {

                            options.error({}, arguments);

                        });

because the save function has no fail function . Where is my mistake?

[wkit23]

I'm facing the same problem. What I did to solve this is to remove jaydatamodules/angular, do not set angular to have dependency on jaydata. After that the error is gone.

[mary1987]

when i removed jaydatamodules/angular, i faced with this error:

Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.18/$injector/modulerr?p0=app&p1=Error%3A%20…%2Flocalhost%3A4203%2FScripts%2Fangular-1.2.18%2Fangular.min.js%3A33%3A139)

here is my scripts:

<link href="~/Content/kendo/2013.1.514/kendo.default.min.css" rel="stylesheet" />
<link href="~/Content/kendo/2013.1.514/kendo.rtl.min.css" rel="stylesheet" />

<link href="~/Content/LookUp.css" rel="stylesheet" />

<script src="~/Scripts/angular-1.2.18/angular.min.js"></script>
<script src="~/Scripts/datajs-1.0.3.min.js"></script>
<script src="~/Scripts/jaydata-1.3.6/jaydata.js"></script>
<script src="~/Scripts/jaydata-1.3.6/jaydatamodules/deferred.js"></script>
<script src="~/scripts/jaydata-1.3.6/jaydatamodules/angular.js"></script>

<script src="~/Scripts/kendo/2013.1.514/kendo.all.min.js"></script>
<script src="~/Scripts/kendo/2013.1.514/kendo.web.min.js"></script>
<script src="~/Scripts/kendo/2013.1.514/kendo.aspnetmvc.min.js"></script>
<script src="~/Scripts/jaydata-1.3.6/jaydatamodules/kendo.min.js"></script>
<script src="~/Scripts/ViewModels.js"></script>

<script src="~/Scripts/App/app.js"></script>
<script src="~/Scripts/App/Services/DataSource.js"></script>
<script src="~/Scripts/App/Directives/lookup-directive.js"></script>
<script src="~/Scripts/App/Directives/grid-directive.js"></script>
<div id="mvvmGrid" crud-grid data-role="grid"
     data-selectable="true" data-height="450"
     data-sortable="true"
     data-editable="inline"
     data-filterable="true"
     data-toolbar='["create", "save", "cancel"]'
     data-columns='[
                                    { field: "Name", title: "نام", width: "180px" },
                                    { field: "Created", title: "تاریخ", width: "200px" },
                                    { field: "LargeNum", title: "عدد نمایشی", width: "180px" },
                                    { field: "Index",hidden:true },
                                    { command :["edit", "destroy", "update"]}
                                  ]'
     data-pageable="{ refresh: true, pageSizes: true }"
     data-source="ds">
</div>