Apply border styles to FlexSheet cells

Apply border styles to FlexSheet cells

Posted by: javier.cintron on 10 April 2018, 3:45 pm EST

• 

  javier.cintron

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 10 April 2018, 3:45 pm EST

  Hi,

  I’m trying to apply border styles to a flexsheet using this code:

  
        this.flexSheet.applyCellsStyle({
          color: 'red',
          borderTopColor: 'black',
          borderBottomColor: 'black',
          borderLeftColor: 'black',
          borderRightColor: 'black',
          borderTopStyle: 'solid',
          borderBottomStyle: 'solid',
          borderLeftStyle: 'solid',
          borderRightStyle: 'solid',
          borderTopWidth: '1px',
          borderBottomWidth: '1px',
          borderLeftWidth: '1px',
          borderRightWidth: '1px'
        });
  
  

  The only style that works is the “color: ‘red’”. Why the border styles aren’t working and how to do this? I’m creating a custom ribbon and I need an easy way to implement this.

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 11 April 2018, 8:18 am EST

  Hi,
  
  This is seems to be bug, we will share an tracking id tomorrow for this.
  
  In the meantime, you can add class name and use CSS to style cells:-
  
  Please refer to following code snippet:

  flex.applyCellsStyle({
  className:'custom-cell'
  },[new wjcGrid.CellRange(2,2,5,3)]);
  }
  //Css
  .wj-cell.custom-cell{
  color: red;
  border: 1px solid blue;
  border-top-color: brown;
  border-bottom-color: brown;
  }
  

  Here is an example of the same:-https://stackblitz.com/edit/angular-jeuark?file=styles.css

  ~Manish

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 15 April 2018, 11:13 pm EST

  Hi,
  
  The issue has been reported with id 317564 (internal use only)

  ~Manish

• 

  javier.cintron

  • Post Options:
  • Link
    Copy

  Posted 30 May 2018, 4:42 pm EST

  Hi, any news on this?

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 30 May 2018, 11:11 pm EST

  Hi Javier,
  
  We are sorry for the delayed response. This issue has been fixed in build 5.20181.462. Please find the updated sample:

  https://stackblitz.com/edit/angular-jjfgsg?file=app/app.component.ts

  ~Manish