save

Saves the currently edited ListView item. Triggers the save event. If the save event is not prevented and validation succeeds the ListView will call the DataSource sync method.

Example

Open In Dojo
 <script type="text/x-kendo-tmpl" id="template">
 <div>
   <dl>
     <dt>Name</dt> <dd>#:name#</dd>
     <dt>Age</dt> <dd>#:age#</dd>
  </dl>
   <div>
       <a class="k-button k-edit-button" href="\\#"><span class="k-icon k-i-edit"></span></a>
  </div>
  </div>
</script>

<script type="text/x-kendo-tmpl" id="editTemplate">
 <div>
   <dl>
     <dt>Name</dt>
     <dd><input type="text" data-bind="value:name" name="name" required="required" /></dd>
     <dt>Age</dt>
     <dd><input type="text" data-bind="value:age" data-role="numerictextbox" data-type="number" name="age" required="required" /></dd>
  </dl>
   <div>
      <a class="k-button k-cancel-button" href="\\#">
        <span class="k-icon k-i-cancel"></span>
        </a>
  </div>
  </div>
</script>
<button class="k-button" id="saveBtn">Save</button>
<div id="listView"></div>
<script>
  $("#listView").kendoListView({
    template: kendo.template($("#template").html()),
    editTemplate: kendo.template($("#editTemplate").html()),
    dataSource: {
      data: [
        { id: 1, name: "Jane Doe", age: 47 },
        { id: 2, name: "John Doe", age: 50 }
      ],
      schema: {
        model: {
          id: "id",
          fields: {
            id: { type: "number" },
            name: { type: "string" },
            age: { type: "number" }
          }
        }
      }
    }
  });
  $("#saveBtn").click(function(){
    $("#listView").data("kendoListView").save();
  });
</script>
In this article