New to Kendo UI for jQuery? Start a free 30-day trial

Add

methods

Appends a data item to the data source.

add

Parameters:modelObject|kendo.data.Model

Either a kendo.data.Model instance or JavaScript object containing the data item field values.

Returns:kendo.data.Model

—The data item which is inserted.

<script>
var dataSource= new kendo.data.DataSource({
  data: [
    { name: "Jane Doe", age: 30 }
  ]
});
dataSource.add({ name: "John Doe", age: 33 });
var data = dataSource.data();
var lastItem = data[data.length - 1];
/* The result can be observed in the DevTools(F12) console of the browser. */
console.log(lastItem.name); // displays "John Doe"
/* The result can be observed in the DevTools(F12) console of the browser. */
console.log(lastItem.age); // displays "33"
</script>

<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    create: {
      url: "https://demos.telerik.com/service/v2/core/products/create",
      type: "POST",
      contentType: "application/json"
    },
    parameterMap: function(data, type) {
      if (type == "create") {
        // send the created data items as the "models" service parameter encoded in JSON
        return kendo.stringify(data.models);
      }
    }
  },
  batch: true,
  schema: {
    model: { id: "ProductID" }
  }
});
// add a new data item
dataSource.add( { ProductName: "New Product" });
// save the created data item
dataSource.sync();
</script>