DataTable focus on a cell

Forms SharePoint 2019
1

Hello,
We use Plumsail Forms for SharePoint (SP 2019) and we are working with dataTable control.
We use this script:

const formatDateInGrid = () => {
    const gridWidget = dtConDnyZavozu.widget;
    const dataSource = gridWidget.dataSource;

    dataSource.data().forEach((item, index, arr) => {
      const isDirty = Object.keys(item.dirtyFields).length !== 0;

      if (isDirty) {
        const dirtyFields = Object.keys(item.dirtyFields);

        dirtyFields.forEach((fieldName, fieldIndex) => {
          if (fieldName === "zaciarknutie") {
            return;
          }

          let inputValue = item[fieldName];

          if (
            inputValue === undefined ||
            inputValue.indexOf(":") !== -1 ||
            inputValue.trim() === ""
          ) {
            return;
          }

          let firstTwoDigits = inputValue.substring(0, 2);
          let secondTwoDigits = inputValue.substring(2);
          let formattedTime = `${firstTwoDigits}:${secondTwoDigits}`;

          item.set(fieldName, formattedTime); // Aktualizace namísto grid.refresh(), aby se focus posouval v řádku na další buňku

          // Zajistit že po vyplnění řádku se mi posune focus na další řádek a né na začátek jak do teď
        });
      }
    });

  };

  dtConDnyZavozu.$on("change", () => {
    setTimeout(() => {
      formatDateInGrid();
    }, 200);
  });

In general - when we select a column in the specific row - for example second row, we click on the cell under column and write down "0600". We want from our script to reformat the value to "06:00" (time).
But when we use at the end of reformating:

dataTable.refresh()

The focus jumps to the beginning of the dataTable. Is there a way how to handle the focus? When the cell is formatted I need to stay on the same place or jump to another cell in the row.

Is there any way how to achieve this?
Thanks
Stepan

2

Hey @StepanS,

Try using

fd.control("DataTable1").widget.editCell("td:eq(0)");

to open a single cell of the table in Edit Mode.

I'm not sure what would be the best way to get the right cell, it might be to use an 'edit' fuction:

dt.$on('edit', (e) => {
  //do something here
})

Here's a useful article on the matter: Kendo UI Grid

3

Hey @IliaLazarevskii ,

thank you for the insight. I will try that and let you know :slight_smile:
Stepan