Paste is not working as expected

Posted by: sathwik.kotla on 6 April 2022, 6:29 pm EST

  • Posted 6 April 2022, 6:29 pm EST - Updated 11 January 2024, 5:40 am EST

    Sheet with custom cell type

    import * as GC from '@grapecity/spread-sheets';
    import { defaultG4MUITheme } from '@highradius/g4_ui_components/lib/components/theme/defaultTheme';
    
    export const DEFAULT_HEIGHT = 28;
    export const DEFAULT_WIDTH = 180;
    const textPrototype: any = GC.Spread.Sheets.CellTypes.Text.prototype;
    const ForecastModelCell = new GC.Spread.Sheets.CellTypes.Base();
    let _oldPaintFn = ForecastModelCell.paint;
    ForecastModelCell.paint = function (
      ctx: CanvasRenderingContext2D,
      value: any,
      x: number,
      y: number,
      w: number,
      h: number,
      style: any,
      options?: any,) {
      // Paints a cell on the canvas.
      style.hAlign = GC.Spread.Sheets.HorizontalAlign.left;
      style.vAlign = GC.Spread.Sheets.VerticalAlign.center;
      style.cellPadding = "0 0 0 10"
      style.font = `${defaultG4MUITheme.typography.body1.fontStyle} ${defaultG4MUITheme.typography.body1.fontWeight} ${defaultG4MUITheme.typography.body1.fontSize} ${defaultG4MUITheme.typography.body1.fontFamily}`;
    
      if (value && typeof value === "object") {
        let indentaion = ((value.depth || 0) + 1) * 10;
        style.cellPadding = `0 0 0 ${indentaion}`
    
        const existingStyle = value.style;
        if (existingStyle) {
          let format = existingStyle.bold ? 'bold ' : '';
          format += existingStyle.italic ? 'italic ' : '';
          format += existingStyle.fontSize ? existingStyle.fontSize + 'px' : defaultG4MUITheme.typography.body1.fontSize;
          style.font = `${format} ${defaultG4MUITheme.typography.body1.fontFamily}`;
          style.foreColor = existingStyle.fontColor;
          style.backColor = existingStyle.fillColor;
        }
        _oldPaintFn.apply(
          this,
          [ctx,
            value.content,
            x,
            y,
            w,
            h,
            style,
            options]
        );
      }
      else {
        // default operation
        style.cellPadding = "0 0 0 0"
        style.hAlign = GC.Spread.Sheets.HorizontalAlign.center;
        _oldPaintFn.apply(this, arguments as any);
      }
    };
    
    ForecastModelCell.setEditorValue = function (editorContext, value, context) {
      var actualVal = context.sheet.getValue(context.row, context.col);
      if (actualVal && typeof actualVal === "object") {
        GC.Spread.Sheets.CellTypes.Text.prototype.setEditorValue.call(
          this,
          editorContext,
          actualVal.content,
          context
        );
      } else {
        // default operation
        textPrototype.setEditorValue.apply(
          this,
          arguments
        );
      }
    };
    
    ForecastModelCell.getEditorValue = function (editorContext, context) {
      var actualVal = context.sheet.getValue(context.row, context.col);
      var editorVal = textPrototype.getEditorValue.apply(
        this,
        arguments
      );
      if (actualVal && typeof actualVal === "object") {
        actualVal.content = editorVal;
        return actualVal;
      } else {
        // default operation
        return editorVal;
      }
    };
    
    const _oldWidthFn = ForecastModelCell.getAutoFitWidth;
    ForecastModelCell.getAutoFitWidth = function () {
      let minWidth = DEFAULT_WIDTH;
      let width = _oldWidthFn.apply(this, arguments as any);
      return Math.max(minWidth, width);
    };
    
    ForecastModelCell.getAutoFitHeight = function (val, text, cellStyle, zoomFactor,
      context) {
    
      let height = DEFAULT_HEIGHT;
      const existingStyle = val && val.style;
      if (existingStyle && existingStyle.fontSize) {
        let fontSize = existingStyle.fontSize;
        return fontSize > 32 ? 80 : fontSize > 23 ? 35 : height;
      }
      return height;
    
    }
    
    ForecastModelCell.format = function (value, format, formattedData, context)
    {
      if(value && value.content) {
        return JSON.stringify(value);
      } else {
          return value;
      }
    }
    
    export const forecastModelCell = ForecastModelCell;
    
    export const forecastModelColumn = { cellType: forecastModelCell };
    
    export const getForecastModelColumns = (colCount: number) => {
      const cols = [];
      for (let i = 0; i < colCount; i++) {
        cols.push(forecastModelColumn);
      }
      return cols;
    }
    
    
    

    when we are trying to paste the cell data which we have copied after performing an undo operation the cell is getting populated with the content rather than the parsed data which is the expected outcome.

    Before pressing ctrl+z when the pasted result is =TOTAL()

    after pressing ctrl+z the cell value is content="TOTAL(),depth=0,“style={…}”

  • Posted 6 April 2022, 11:03 pm EST

    Hi,

    Could, you please share a working sample that replicates the issue so that could investigate the root cause of the issue and help[p you accordingly. You may also modify the following sample and send us back.

    sample: https://jscodemine.grapecity.com/share/sfbvCfCwHEOxM-lkGFAxqA/

    Regards,

    Avinash

  • Posted 7 April 2022, 8:30 pm EST - Updated 29 September 2022, 5:00 am EST

    When we are trying to copy and paste the cell value the value we are getting string as the cell value instead of the object.

  • Posted 9 April 2022, 8:30 pm EST

  • Posted 10 April 2022, 9:13 pm EST - Updated 29 September 2022, 5:00 am EST

    hI,

    We are sorry but the attached sample has an error. Could you please share a working sample that replicates the issue so that we could investigate it further and help you accordingly?

    Regards,

    Avinash

  • Posted 10 April 2022, 9:29 pm EST - Updated 29 September 2022, 5:00 am EST

    features_cells_formatter_custom-formatter_JavaScript.zip

    When I am trying to copy and paste data from the custom cell type, in the target cell we are not getting the exact object which we have copied instead we are getting the cell value as a string i.e.[object Object]

    Please look into this issue and provide with appropriate solution.

  • Posted 10 April 2022, 10:43 pm EST

    Hi,

    Thanks for the sample. for supporting copyPasting in custom cell type you need to define the typeName property. Please refer to the following code snippet and let me know if you face any issues.

    
    function forecastModelCell() {
      this.typeName = "forecastModelCell";
    }
    const DEFAULT_HEIGHT = 28;
    const DEFAULT_WIDTH = 180;
    const textPrototype = GC.Spread.Sheets.CellTypes.Text.prototype;
    forecastModelCell.prototype = new GC.Spread.Sheets.CellTypes.Base();
    
    

    Regards.

    Avinash

  • Posted 10 April 2022, 11:03 pm EST

    features_cells_formatter_custom-formatter_JavaScript.zip

    Now can you please try to copy any cell and paste it then we are getting the exact object.

    Then if you undo the operation I.e if you press ctrl+z key the undo operation is performed now try to paste the content in any of the empty cell then we are getting the string instead of object.

  • Posted 10 April 2022, 11:13 pm EST

    https://easyupload.io/nhrpda

    Please refer to this vedio

    password is 12345

  • Posted 11 April 2022, 10:51 pm EST

    Hi,

    This is expected/ when we press the ESC button/ by ctrl +z it clears the internal clipboard that is why the cell type is not getting copied and content is pasted from the system clipboard which is just a simple string.

    Regards,

    Avinash

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels