updateSettings method getting destroyed

Tags: #<Tag:0x00007f8b26685520> #<Tag:0x00007f8b26684f80>

Hi, I am trying to update the settings after copying column configuration from one column to the other. After copying and pasting I am calling an api which gives me updated column configuration based on the copied data and then I am trying to update the settings but when I am trying to do so I am getting this error.
The updateSettings method is working just fine when I am copying cell configuration to other cells or when I am changing other settings of the table.

My update settings method :
this.hot.updateSettings({

    data: updateData,

    width: this.parentElement.width - 5,

    height: this.getFormattedHeight(),

    colWidths: this.setColWidth,

    rowHeights: this.setRowHeight.length > 0 ? this.setRowHeight : 37,

    contextMenu: this.designerMode != "preview" ? true : false,

    mergeCells: this.setMergeArr.length > 0 ? this.setMergeArr : [],

    stretchH: "all",

    minSpareRows: false,

    manualColumnResize:

      this.designerMode != "preview" && this.isResizeToggle ? true : false,

    manualRowResize:

      this.designerMode != "preview" && this.isResizeToggle ? true : false,

    customBorders: this.borderFormatting,

    hiddenColumns: {

      columns: this.hiddenColumnData.length > 0 ?  this.hiddenColumnData : false ,

      indicators:true,

     },

     columns: this.headerData,

  });

Hi @anandkumarsingh

Do you have any custom logic for the beforePaste/afterPaste or beforeChange/afterChange?

Here ContextMenu callback - The "runHooks" method cannot be called I see a report about getting the same error message. Please read it and let me know if those tips helped. If not, I would need to ask for a demo to replicate the issue.

Yes, I have a custom logic in afterPaste hook which I have shared below. The issue is that this error message is only appearing when I am trying to copy column styles, for all the other cases it is working just fine.

this.hot.addHook(“afterPaste”, (data, coords) => {

  this.isCopyCell = true;

  if (isColumnCopy) {

    (coords[0].startRow == this.staticRowNo &&

      coords[0].endRow == this.staticRowNo) ||

      !this.tablePreviewData[1];

    for (let i = 0; i < coords.length; i++) {

      for (let m = coords[i].startRow; m <= coords[i].endRow; m++) {

        for (let j = coords[i].startCol; j <= coords[i].endCol; j++) {

          if (

            this.tablePreviewData[0].tableConfig.properties.serialNumber

          ) {

            if (j == 0) {

              return;

            }

          } else {

            j = j + 1;

          }

          let selectedCol = "Column " + j;

          //activating the selected column

          this.onColumnEdit(this.getCorrectSelectedColumn(selectedCol));

          //getting the copied column configuration which is to be pasted in selected column

          this.tablePreviewData[0].columnsConfig.forEach((col) => {

            if (col.properties.displayName.editId == copyCell.title.id) {

              copyCell.savedConfigureConfig.properties = col.properties;

              copyCell.savedConfigureConfig.properties.colName =

                this.selectedColumnComponent.savedConfigureConfig.properties.colName;

              copyCell.savedConfigureConfig.properties.columnName =

                this.selectedColumnComponent.savedConfigureConfig.properties.columnName;

              copyCell.savedConfigureConfig.style = col.style;

            }

          });

         

          this.setCopiedColumnValue(copyCell);

          this.isFromColCopy = true;

          this.commonService.setMergeCells({

            isColumnCopy: this.isFromColCopy,

            cellData: _.cloneDeep(copyCell),

            isLastValue: this.isLastValue,

            selectedCell: this.selectedColumnComponent,

            name: this.selectedColumnComponent.name,

            componentuuid: this.selectedColumnComponent.uuid,

            parentComponentId: this.config.uuid,

          });

        }

      }

    }

  } else {

    for (let i = 0; i < coords.length; i++) {

      //   let column = 'Column' + ' ' + (coords[0].startCol + 1);

      for (let m = coords[i].startRow; m <= coords[i].endRow; m++) {

        for (let j = coords[i].startCol; j <= coords[i].endCol; j++) {

          this.prevCopiedVal = copyCell;

          copyCell.properties["cellLabel"] =

            "Cell " + (m + 1) + "," + (j + 1);

          this.isLastValue = j == coords[i].endCol ? true : false;

        }

        this.commonService.setMergeCells({

          isCellCopy: true,

          cellData: _.cloneDeep(copyCell),

          isLastValue: this.isLastValue,

          selectedCell: this.selectedCell,

          componentuuid: cellId,

          parentComponentId: this.config.uuid,

        });

        this.prevCoords = coords;

      }

    }

    this.isCopyCell = false;

    this.isLastValue = false;

  }

});

Maybe they are not available (not all data that you’d like to access is rendered).

Would you be able to send me a working demo? I think that we will be able to specify what causes the issue after debugging the demo.

Thank you,
I am not accessing the data from the table. What I am doing is when user selects a cell and presses ctrl+c, I call the hook afterCopy in which I get the selected cells coordinates and based on that coordinates I retrieve that cells configuration from an object which contains the configuration of all the cells and store it in another object let’s say copyCell.
Then when user selects another cell and pastes this configuration what I do is based on the coordinates of the selected cell I modify the configuration of this selected cell with the values of copyCell and then an api is called which takes the new configuration and sends a new response based on that I use update settings method.

1 Like

Thank you for your message @anandkumarsingh

I just got your email, so we can continue there.