Edit this page

transport.update Object |String |Function

The configuration used when the data source saves updated data items. Those are data items whose fields have been updated.

The data source uses jQuery.ajax to make a HTTP request to the remote service. The value configured via transport.update is passed to jQuery.ajax. This means that you can set all options supported by jQuery.ajax via transport.update except the success and error callback functions which are used by the transport.

If the value of transport.update is a function, the data source invokes that function instead of jQuery.ajax.

If the value of transport.update is a string, the data source uses this string as the URL of the remote service.

All transport actions (read, update, create, destroy) must be defined in the same way, that is, as functions or as objects. Mixing the different configuration alternatives is not possible.

Example - specify update as a string

<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    read:  {
      url: "https://demos.telerik.com/kendo-ui/service/products",
      dataType: "jsonp" // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
    },
    update: {
      url: "https://demos.telerik.com/kendo-ui/service/products/update",
      dataType: "jsonp" // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
    }
  },
  schema: {
    model: { id: "ProductID" }
  }
});
dataSource.fetch(function() {
  var product = dataSource.at(0);
  product.set("UnitPrice", 20);
  dataSource.sync(); //makes request to https://demos.telerik.com/kendo-ui/service/products/update
});
</script>

Example - specify update as a function

<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    read: function(options) {
      /* implementation omitted for brevity */
    },
    update: function(options) {
      // make JSONP request to https://demos.telerik.com/kendo-ui/service/products/update
      $.ajax({
        url: "https://demos.telerik.com/kendo-ui/service/products/update",
        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)
        },
        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);
        }
      });
    }
  },
  batch: true,
  schema: {
    model: { id: "ProductID" }
  }
});
dataSource.fetch(function() {
  var product = dataSource.at(0);
  product.set("UnitPrice", 20);
  dataSource.sync(); //makes request to https://demos.telerik.com/kendo-ui/service/products/update
});
</script>

transport.update.cache Boolean

If set to false, the request result will not be cached by the browser. Setting cache to false will only work correctly with HEAD and GET requests. It works by appending "_={timestamp}" to the GET parameters. By default, "jsonp" requests are not cached.

Refer to the jQuery.ajax documentation for further information.

Example - enable request caching

<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    update: {
      /* omitted for brevity */
      cache: true
    }
  }
});
</script>

transport.update.contentType String

The content-type HTTP header sent to the server. Default is "application/x-www-form-urlencoded". Use "application/json" if the content is JSON. Refer to the jQuery.ajax documentation for further information.

Example - set content type

<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    update: {
      /* omitted for brevity */
      contentType: "application/json"
    }
  }
});
</script>

transport.update.data Object |Function

Additional parameters which are sent to the remote service. The parameter names must not match reserved words, which are used by the Kendo UI DataSource for sorting, filtering, paging, and grouping.

Refer to the jQuery.ajax documentation for further information.

Example - send additional parameters as an object

<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    update: {
      /* omitted for brevity */
      data: {
        name: "Jane Doe",
        age: 30
      }
    }
  }
});
</script>

Example - send additional parameters by returning them from a function

<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    update: {
      /* omitted for brevity */
      data: function() {
        return {
          name: "Jane Doe",
          age: 30
        }
      }
    }
  }
});
</script>

transport.update.dataType String

The type of result expected from the server. Commonly used values are "json" and "jsonp".

Refer to the jQuery.ajax documentation for further information.

Example - set the data type to JSON

<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    update: {
      /* omitted for brevity */
      dataType: "json"
    }
  }
});
</script>

transport.update.type String

The type of request to make ("POST", "GET", "PUT" or "DELETE"). The default request is "GET".

The type option is ignored if dataType is set to "jsonp". JSONP always uses GET requests.

Refer to the jQuery.ajax documentation for further information.

Example - set the HTTP verb of the request

<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    update: {
      /* omitted for brevity */
      type: "POST"
    }
  }
});
</script>

transport.update.url String |Function

The URL to which the request is sent.

If set to function, the data source will invoke it and use the result as the URL.

Example - specify URL as a string

<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    read:  {
      url: "https://demos.telerik.com/kendo-ui/service/products",
      dataType: "jsonp" // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
    },
    update: {
      url: "https://demos.telerik.com/kendo-ui/service/products/update",
      dataType: "jsonp" // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
    }
  },
  schema: {
    model: { id: "ProductID" }
  }
});
dataSource.fetch(function() {
  var product = dataSource.at(0);
  product.set("UnitPrice", 20);
  dataSource.sync();
});
</script>

Example - specify URL as a function

<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    read:  {
      url: "https://demos.telerik.com/kendo-ui/service/products",
      dataType: "jsonp" // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
    },
    update: {
      url: function(options) {
        return "https://demos.telerik.com/kendo-ui/service/products/update"
      },
      dataType: "jsonp" // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
    }
  },
  schema: {
    model: { id: "ProductID" }
  }
});
dataSource.fetch(function() {
  var product = dataSource.at(0);
  product.set("UnitPrice", 20);
  dataSource.sync();
});
</script>
Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy