ajax - Kendo UI: Update transport doesn't trigger after calling datasource sync -

im struggling on in hours now, cant find documentation on how implement simple ajax update on server using forms , kendo mvvvm , datasource.

kendo mvvm

$(function() {      var apiurl = "http://a31262cd2f034ab8bcda22968021f3b8.cloudapp.net/api",                     meetingdatasource = new kendo.data.datasource({             transport: {                 read: {                     url: apiurl + "/meetings/4",                     datatype: "jsonp"                 },                 update: {                     type: "put",                     url: apiurl + "/meetings",                     contenttype: "application/json; charset=utf-8",                     datatype: 'json',                 },                  parametermap: function(options, operation) {                     return kendo.stringify(options);                 }             },             batch: true,             change: function() {             },             schema: {                 model: {                     id: "id",                     fields: {                         title: { editable: true },                         starttime: { type: "date" },                         endtime: { type: "date" }                     }                 }             }         });      meetingdatasource.fetch(function () {          var viewmodel = kendo.observable({             description: result.description,             title: result.title,             venue: result.location,             startdate: result.starttime,             enddate: result.endtime,             savechanges: function (e) {                  //im not sure line                 this.set("title", this.title);                 meetingdatasource.sync();                  e.preventdefault();              }         });          kendo.bind($("#view"), viewmodel);     });  }); 

the ui

<ul class="forms"  id="ul-meeting">             <li>                 <label for="title" >title:</label>                  <input data-bind="value: title" class="k-textbox" style="width:350px;"/>             </li>             <li>                 <label for="description" >description:</label>                  <textarea data-bind="value: description"  id="description" rows="6" cols="80" class="k-textbox" style="width:350px;"></textarea>             </li>             <li>                     <label for="location">venue:</label>                  <textarea  data-bind="value: venue" id="location" rows="4" cols="80" class="k-textbox" style="width:350px;"></textarea>             </li>             <li>                 <p>                     <label for="start-datetime">start:</label>                      <input  data-bind="value: startdate" id="start-datetime" style="width:200px;" />                 </p>                 <p>                     <label for="end-datetime">finish:</label>                      <input data-bind="value: enddate"  id="end-datetime" style="width:200px;" />                 </p>             </li>         </ul> 

the problem is, transport read triggers transport update never triggers if explicity call datasource.sync(). is missing here?

your code not complete (you not showing result or how trigger savechanges see problem not updating content of datasource (meetingdatasource).

in code copy fields result , observableobject never update content of datasource. when this.set, in context this not datasource when call sync doing nothing.

try doing:

meetingdatasource.data()[0].set(`title`, this.title); meetingdatasource.sync(); 

this should trick!