Questions on inline edit grid

[Matthieu]

Hi,

I have several questions around grid inline editing functionnalities:

• I didn't succeed to implement custom multiselect with checkbox mode, it didn't show the checkboxes. If I use simple 'Box' mode, it's working as expected. Here is the code I use:

          column.editSettings = {

            instance: undefined,

            behavior: {

              create: () => { return document.createElement('input') },

              read: () => { return column.editSettings.instance.value },

              destroy: () => { column.editSettings.instance.destroy(); },

              write: (args) => {

                // reset filteredRecords

                column.filteredRecords = column.unfilteredRecords;

                column.selectedRecord = Array.isArray(args.rowData[args.column.field]) ? args.rowData[args.column.field] : [args.rowData[args.column.field]];

                column.editSettings.instance = new MultiSelect({

                  dataSource: column.filteredRecords,

                  fields: { text: 'capt', value: 'code' },

                  value: column.selectedRecord,

                  popupHeight: '300px',

                  popupWidth: '200px',

                  mode: 'CheckBox',

                  change: (event: any) => {

                      column.selectedRecord = event.itemData;

                   }

                });

                column.editSettings.instance.appendTo(args.element);

              }

            }

          }



• I need to change dynamically the value of another column from the change event of a column. How can I access the form control of a column?  
• Is the inline edit mode working in responsive mode? It renders incorrectly:
  

Thanks a lot for your response,

Regards,

Matt Richard

[Rajapandiyan Settu]

Hi Matthieu,

Thanks for contacting Syncfusion support.

Query #1: I didn't succeed to implement custom multiselect with checkbox mode.

We suggest you to inject the CheckBoxSelection module in the MultiSelect component to use checkbox mode.

MultiSelect with checkbox: https://ej2.syncfusion.com/documentation/multi-select/checkbox/

import { MultiSelect, CheckBoxSelection } from '@syncfusion/ej2-dropdowns';

MultiSelect.Inject(CheckBoxSelection);

 

Query #2: I need to change dynamically the value of another column from the change event of a column. How can I access the form control of a column?

By using the following code, you can change the value of another input element.

 

          change: function (args) {

            // get the input element of CustomerID field using the Grid id and column name

            var customerIDEle = this.grid.editModule.formObj.element.querySelector('#' + this.grid.element.id + 'CustomerID');

            if (customerIDEle) {

              customerIDEle.value = 'Changed';

            }

          }.bind(this),

 

Sample: https://stackblitz.com/edit/angular-tk22fz-knyd1v?file=app.component.html,app.component.ts

Query #3: Is the inline edit mode working in responsive mode?

We are validating this query from our side and will update further details on or before Oct 28^th, 2022.

We appreciate your patience until then.

Regards,

Rajapandiyan S

[Rajapandiyan Settu]

Hi Matthieu,

Thanks for your patience.

Query #3: Is the inline edit mode working in responsive mode?

In EJ2 Grid, the Adaptive view feature does not support with Inline Editing feature. The Adaptive View Grid supports only limited features, kindly refer to the below documentation for more information.

Adaptive View Limitation: https://ej2.syncfusion.com/angular/documentation/grid/adaptive/#supported-features-by-vertical-row-rendering

Regards,

Rajapandiyan S

[Matthieu]

Hi,

 

Thanks for the reponse. 

Query #1: Got it working with your tip, thanks.

Query #2: Will try it and get back to you

Query #3: Do you plan to support it soon?

Regards,

Matt Richard

[Joseph Christ Nithin Issack]

Hi Matthieu,

   Thanks for your update.

   Based on your requirement, you want to edit the vertical rows using inline edit mode, unfortunately we do not have any plans for implementing this as a feature in the near future.

Regards,

Joseph I.