onInput event for cell editing in batch mode

[Karthik]

Hello Team,

I need to calculate some values on inputing the value into the cell.

at present we have cell edit and cell save events to track the start and end of the event.

however i need the oninput event i.e i need to track the cell value while editing also.

i am using ejs grid and editing in batch Mode

[Santhosh Iruthayaraj]

Hi Karthik,

Greetings from Syncfusion support.

You can bind the input event and other events available to the specific editors in the Grid by utilizing the "columns.edit.params" feature of the Grid. We have prepared a code snippet and sample for your reference, which you can find below:

[app.component.html]

 

      <e-column

        field="OrderID"

        headerText="Order ID"

        width="120"

        textAlign="Right"

        isPrimaryKey="true"

      ></e-column>

      <!-- set the edit.params to the columns in which you wanted to bind events -->

      <e-column

        field="CustomerName"

        editType="stringedit"

        [edit]="editParams"

      ></e-column>

      <e-column

        field="OrderDate"

        editType="datepickeredit"

        [edit]="editParams"

      ></e-column>

      <e-column

        field="Freight"

        editType="numericedit"

        [edit]="editParams"

      ></e-column>

      <e-column

        field="ShippedDate"

        [edit]="editParams"

      ></e-column>

      <e-column

        field="ShipCountry"

        editType="dropdownedit"

        [edit]="editParams"

      ></e-column>

 

[app.component.ts]

 

  ngOnInit(): void {

    .  .  .  .  .

    this.editParams = {

      params: {

        // input event triggers only for text editor

        input: (e) => {

          console.log('input ->', e);

        },

 

        // for other type of editors change event triggers

        change: (e) => {

          console.log('change ->', e);

        },

      },

    };

  }

 

Sample: https://stackblitz.com/edit/angular-grid-with-batch-editing

You can find more information about "columns.edit.params" in the documentation link below:

Documentation: https://ej2.syncfusion.com/angular/documentation/grid/editing/edit-types

Please let us know if you have any further queries.

Regards,

Santhosh I