No sync with datasource

[Timur]

Hi,

i am implementing an copy button for a grid. Thats my code. The click handler is implemented at the end. I can insert the new record to the grid but when i call 

dataSource.sync();

no request is made to the server. Can i call the create function manually? I tested the code with

Kendo UI Web v2012.1.322
and
Kendo UI Complete v2012.1.515

$(document).ready(function() {

 

  var dataSource = new kendo.data.DataSource({             

    transport: {

        read: {

          url: "/rentingtenants/?property_id=#{@property.id}",

          dataType: "json"

        },

        update: {

          url: "#{update_attribute_rentingtenants_url}",

          dataType: "json",

          type: "GET",

          complete: function(e) {

            $("#grid").data("kendoGrid").dataSource.read();

          }                                               

        },

        destroy: {

          url: "#{remove_rentingtenants_url}",

          dataType: "json",

          type: "GET"           

        },

        create: {

          url: "#{rentingtenants_url(:property_id => @property.id )}",

          type: "POST",

          complete: function(e) {

            $("#grid").data("kendoGrid").dataSource.read();

          }                                   

        },

        parameterMap: function(options, operation) {

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

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

          }

        }         

    },

    batch: true,           

    schema: {

      model: {

          id: "id",       

          fields: {      

            renter: { editable: true, type: "string", validation: { required: true } },           

            useright: { editable: false, type: "string" },                         

            rentablespace: {

              editable: true,

              nullable: false,

              type: "number",

              validation: {

                  min: 1,                 

                  rules: {

                      required: true

                  },

                  messages: {

                      required: "Bitte geben Sie eine Mietfläche ein."

 

                  }

              }

            },               

            vacant: { editable: true, type: "boolean" },

            monthlyrent: { editable: true, type: "number" },

            rental_end: { editable: true, type: "date"},                                                                   

            indexfree: { editable: true, type: "boolean" },

            option: { editable: true, type: "boolean" },

            comments: { editable: true, type: "string" }                                         

          }

        }

      },

    aggregate: [ { field: "rentablespace", aggregate: "sum" }, { field: "monthlyrent", aggregate: "sum" }]       

  });

       

  $('#grid').kendoGrid({

      sortable: true,

      dataSource: dataSource, 

      navigatable: true,

      dataBound: onDataBound,

      remove: function(e) {

        handleRemoveChanges(e, this);       

      },

      saveChanges: function (e) {

        handleSaveChanges(e, this);

      },

      toolbar: [

        { name: "create", text: "Neue Mieteinheit" },

        { name: "save", text: "Änderungen speichern" },

        { name: "cancel", text: "Änderungen verwerfen" }

      ],

      columns: [

          { field: "renter", title: "Mieter", width: 100, editor: renterDropDownEditor },

          { field: "useright", title: "Nutzungsrecht", width: 120},

          { field: "rentablespace", title:"Mietfläche", template: "#= kendo.toString(rentablespace, 'n2') # m²", footerTemplate: "#= kendo.toString(sum, 'n2') # m²", width: 110 },

          { field: "vacant", template: "#= vacant == true ? 'Ja' : 'Nein' #", title:"Leerstehend", width: 80 },           

          { field: "monthlyrent", title:"Monatsmiete", format: "{0:c}", footerTemplate: "#= kendo.toString(sum, 'c2') #", width: 90 },           

          { field: "rental_end", title:"Vertragsende", width: 90, template: "#= rental_end != 'null' && rental_end != '' ? kendo.toString(rental_end, 'dd.MM.yyyy') : '' #", width: 90 },           

          { field: "indexfree", title:"Indexfrei", template: "#= indexfree == true ? 'Ja' : 'Nein' #", width: 60 },

          { field: "option", title:"Option", template: "#= option == true ? 'Ja' : 'Nein' #", width: 50 },

          { field: "comments", title:"Kommentar", width: 100 },

          { title: "", width: 100, command: [{ name: "copy", text: "Kopieren", className: "copy-button"}, { name: "destroy", text: "Löschen" }] },           

      ],                                               

      editable: {

          update: true,

          confirmation: "Wollen Sie die Mieteinheit wirklich löschen?",

          save: true,                                               

          mode: "incell"           

      }                                               

  });

   

  $("#grid").delegate(".copy-button", "click", function(e) {

    var row = $(this).closest("tr"),

    grid = $(this).parents("[data-role=grid]").data("kendoGrid"); //gets child grid

 

    var model = grid.dataItem(row);

    dataSource.insert(0, model);                           

    dataSource.sync();

    e.preventDefault();     

  });                                                                                                                                                                    

});

[Devon]

I'm having the same problem.

When I call dataSource.sync(), nothing happens. There's no interaction with the server at all.

Does anyone have any idea why this is happening?

[Igor]

I'm having the exact same problem. 

Here is the code:

$(document).ready(function() {

    $("#grid").kendoGrid({

        dataSource: {

            pageSize: 10,

            type: "json",

            serverPaging: true,

            serverSorting: true,

            transport: {

                read: {

                    url:"data.php",

                    dataType: "json",

                    type: "GET",

                    contentType: "application/json; charset=utf-8"

                },

                update: {

                    url: "data.php",

                    type: "POST"

                }

            },

            error: function(e) {

                    alert(e.responseText);

            },

            schema: {

                data: "data",

                total: "c",

                model: {

                    id: "site_url_id",

                    fields: {

                        site_domain_id: { type: "number" },

                        site_url_address: { type: "string" }

                    }

                }

            }

        },

        columns: [{field:"site_domain_id"}, {field:"site_url_address"}],

        toolbar: ["create", "save", "cancel"],

        pageable: true,

        selectable: true,

        editable: true,

        sortable: true

    });

     

    $("#btnEdit").click(function(e){

        var grid = $("#grid").data("kendoGrid");

        var ds = grid.dataSource;

        var gridSelection = grid.select();

     

         

        gridSelection.each(function(){

                     

            var model = grid.dataItem(this);           

            var data = ds.get(model.site_url_id);

            data.site_url_address = "something";

            ds.insert(0, data);

            ds.sync();

            grid.saveChanges();

        });

    });

     

     

});

It successfully updates the grid but when I refresh the datasource, nothing is sent to the server for update.

[Igor]

If someone is interested here how this works:

$("#btnEdit").click(function(e){

        var grid = $("#grid").data("kendoGrid");

        var ds = grid.dataSource;

        var gridSelection = grid.select();

 

        gridSelection.each(function(){                     

            var model = grid.dataItem(this);           

            var data = ds.get(model.site_url_id);

            data.set("site_url_address", "value");

 

            ds.sync();

            ds.read();

        });

    });

[Abhishek]

1- Try to disable the cache in Kendo grid's datasource read property.

'cache: false'

read: {

    dataType: "json",

    url: <<"url">>,

    cache: false

}



and then,

2- $("#grid").data("kendoGrid").dataSource.read();

It worked for me :)