Inline editing auto save

[Michael]

I was able to get inline editing working with an update button like so:

 

one of my columns: { command: ["edit", "delete"], title: " ", width: "200px" }

{
      editable: {
        mode: "inline"
      },
      columns: setColumnsForTab(tabName, paymentClicked),
      dataSource: new kendo.data.DataSource({
        pageSize: 15,
        data: $ctrl[tabName + 'GridData'],
        transport: {
          read: (options) => {
            options.success($ctrl[tabName + 'GridData']);
          },
          update: function(e) {
            console.log("update is called: ", e);
            var updateItem = e.data;
            console.log("updated object : ", updateItem);
            e.success();
          },
          destroy: function(e) {
            console.log("destroy");
            e.success();
          },
          save: function(e) { console.log(e) },
          create: function(e) {
            console.log("create is called:", e);
            console.log("create data is:", e.data);
            e.success(e.data);
          }
        },
        schema: {
          data: function(response) {
            console.log("results", response);
            return response;
          },
          model: {
            id: 'id',
            fields: {
              amountApplied: {
                editable: true
              },
              }
          }
        }
      })
    }

 

How can I configure the options so that changes to the gridData are saved while the user is typing in the editable "amountApplied" field, rather than making the user click edit, and then type, and then click update, for it be saved to the gridData?

[Dimiter Topalov]

Hello Michael,

If I understand correctly, you would like to edit a Grid row, without entering in editing mode. This functionality is not built-in or supported out-of-the-box, but can be achieved via some custom coding, as shown in the following how-to article from our documentation:

http://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/Editing/grid-editors-in-column-templates

It is based on omitting the usual column binding via the columns.field configuration, and relying on templates, and custom binding for the editing functionality. I have made the necessary adjustments for adapting it to an AngularJS application:

http://dojo.telerik.com/OgEQI

I hope this helps.

Regards,
Dimiter Topalov
Telerik by Progress