Copy current cell with selection mode Row

Copy current cell with selection mode Row

Posted by: tie_entwicklung on 29 November 2017, 5:05 am EST

• 

  tie_entwicklung

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 29 November 2017, 5:05 am EST

  I want to copy the selected Cell content (ctrl + c), not the whole row even if I use [selectionMode]=“‘Row’”. Can i override the default copy function?
  
  I use the selectionMode only for the nice view, my grid is ReadOnly

• 

  grapecity

  • Post Options:
  • Link
    Copy

  Posted 4 December 2017, 5:21 am EST

  Hi,

  Following are the steps to accomplish this:

  1. Set autoClipboard to true.
  2. Subscribe to gris’s ‘copying’ event
  3. In the event handler cancel the event after getting the content of the cell.
  4. Set cell’s clip string as to clipboard.

  Angular2 code:

  <wj-flex-grid 
      #test
      [itemsSource]="data" 
      [selectionMode]="'Row'" 
      [autoClipboard]="true"
      (copying)="oncopying($event)">
  </wj-flex-grid>
  

  import { Component, ViewChild } from '@angular/core';
  import * as wjGrid from 'wijmo/wijmo.grid';
  import { DataService } from './data.service';
  import * as wjCore from 'wijmo/wijmo';
  import { WjFlexGrid } from 'wijmo/wijmo.angular2.grid';
  
  @Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
  })
  export class AppComponent {
  
    public data;
    @ViewChild('test') test : WjFlexGrid;
    constructor(private _DataService:  DataService) {
      this.data = this._DataService.getData(20);
    }
  
    oncopying(e: wjGrid.CellRangeEventArgs){
      var clip = this.test.getCellData(e.row, e.col, true);
      wjCore.Clipboard.copy(clip);
      e.cancel = true;
    }
  }
  

  ~nilay

• 

  Gopala.Chintakindi

  • Post Options:
  • Link
    Copy

  Posted 27 March 2018, 4:53 pm EST

  I tried it doesnot work. I have a copy button on UI and when I click I need to copy entire wijmo grid with styles so that user can do Ctrl+V and paste it into Outlook email or excel sheet or word document or text editor… How to do this…

• 

  grapecity

  • Post Options:
  • Link
    Copy

  Posted 2 April 2018, 5:12 am EST

  Hi Gopala,

  The solution provided above works fine for the use case it was written for.

  As for your use case, you need to copy the grid’s style with data which is much more complicated. Currently styles are not allowed to be copied with grid’s data. The workaround is to create your own clipboard string from the cell data.

      const r1 = (this.flex.selection.row > this.flex.selection.row2) ? this.flex.selection.row2 : this.flex.selection.row ;
      const r2 = (this.flex.selection.row > this.flex.selection.row2) ? this.flex.selection.row : this.flex.selection.row2 ;
      const c1 = (this.flex.selection.col > this.flex.selection.col2) ? this.flex.selection.col2 : this.flex.selection.col;
      const c2 = (this.flex.selection.col > this.flex.selection.col2) ? this.flex.selection.col : this.flex.selection.col2;
  
      let clipString = '<table>{0}</table>';
  
      for (let i = r1; i <= r2; i++) {
        let clipRow = '<tr>{1}</tr>';
        for (let j = c1; j <= c2; j++) {
          clipRow = clipRow.replace('{1}', '<td>' + this.flex.getCellData(i, j, true) + '<td>{1}');
        }
        clipRow = clipRow.replace('{1}', '');
        clipRow = clipRow + '{0}';
        clipString = clipString.replace('{0}', clipRow);
      }
      clipString = clipString.replace('{0}', '');
  

  ~nilay

  PS: setting custom clipboard strings are beyond scope of flexgrid.

• 

  Gopala.Chintakindi

  • Post Options:
  • Link
    Copy

  Posted 2 April 2018, 12:55 pm EST

  I will try and let you know…