Change cell content with format item

Change cell content with format item

Posted by: pirobox on 1 March 2018, 2:04 pm EST

• 

  pirobox

  • Post Options:
  • Link
    Copy

  Posted 1 March 2018, 2:04 pm EST

  Hi,
  
  I’m using flexgrid and its event formatitem to change the text of a cell.

  In this example, I’m simply setting “aaaa” in all the cells.
  
  http://jsfiddle.net/pirobox/LLhe4d8x/2/

  the problem is that the cell is no more editable. I mean, if I double click in it, text moves slightly but nothing actually happens.

  So, my question is, am I using the right approach? With the FormatItem event, should I be able to change the content of a cell and continue editing it?
  
  If no, which approach should I use? Would a CellFactory work better? Is there any example of this?

  regards, Andrea

• 

  pirobox

  • Post Options:
  • Link
    Copy

  Posted 2 March 2018, 8:12 am EST

  Hi,
  
  actually I’ve the same problem with a custom cell factory
  
  http://jsfiddle.net/pirobox/jaf7zv5p/

  I did copy it from one of your example, but, again, that example had only readonly cells.
  
  So, does it mean that I can’t customize the rendering of an editable cell?

  regards, Andrea

• 

  carlo.vecchiato

  • Post Options:
  • Link
    Copy

  Posted 5 March 2018, 9:14 am EST

  Hi there,
  
  did you solve it?
  
  I have same problem.
  
  Actually I noticed that just doing

  cell.innerHTML = cell.innerHTML;
  

  inside itemFormatter will brake normal behavior of Flexgrid.

  Wijmo team: how do you use itemFormatter together with customEditor?
  
  Do you have any example?

  Cheers!!!

• 

  pirobox

  • Post Options:
  • Link
    Copy

  Posted 6 March 2018, 3:25 am EST

  Hi,
  
  any news about this?

  regards, Andrea

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 6 March 2018, 5:21 am EST

  I can replicate this. Need some time to work on this.

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 8 March 2018, 6:11 am EST

  Hi,
  
  You need to first check for active editors in formatItem handler before modifying the HTML of cell.
  
  Please refer to updated fiddle:- http://jsfiddle.net/z14xd6j0/

  Also note that item formatter only modifies the display values.If you want permanent changes then you need to update the item source of grid.

• 

  meghas

  • Post Options:
  • Link
    Copy

  Posted 21 April 2020, 10:04 am EST

  Hi Abhishek,

  i am trying to add icon in cell on condition bases. I am using
  
  html = wjcCore.format(

  <i class="errorBox"><mat-icon class= "mat-icon notranslate material-icons mat-icon-no-color">error_outline</mat-icon></i>

  , panel.rows[r].dataItem);
  
  cells[i].innerHTML = cells[i].innerHTML + html;
  
  but when i scroll the grid and come pack to the same column the added html removes.

  I am using itemformatter and on particular condition trying to add icon in cell.

  can you please tell how can i modify cell content permanently.

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 22 April 2020, 12:55 am EST

  Hi Megha,

  It seems that you are adding material icons on the FlexGrid. Directly adding a mat-icon in the innerHTML of the cell will not work. I would suggest you use the cell template of FlexGrid to add mat icons directly in HTML template.

  https://stackblitz.com/edit/angular-gtvnud

  For more information on cell templates, please refer to the following links below:

  Demo: https://www.grapecity.com/wijmo/demos/Grid/CustomCells/CellTemplates/Overview/angular

  API: https://www.grapecity.com/wijmo/api/classes/wijmo_angular2_grid.wjflexgridcelltemplate.html

  Regards,
  
  Ashwin

• 

  meghas

  • Post Options:
  • Link
    Copy

  Posted 22 April 2020, 1:06 am EST

  Thank you Ashwin