Wj flexsheet: Column Header displaying binding value from ColumnLayout

Wj flexsheet: Column Header displaying binding value from ColumnLayout

Posted by: reeshabh.choudhary on 5 April 2019, 4:44 am EST

• 

  reeshabh.choudhary

  • Post Options:
  • Link
    Copy

  Posted 5 April 2019, 4:44 am EST

  After upgrading wijmo version from 5.20182.500 to 5.20183.568, wj-flex-sheet is displaying binding value from custom column layout as header instead of showing header value as header.
  
  our custom column layout has object in folloing structure:
  
  {
  
  binding : “binding value”,
  
  header : “Header1”,
  
  isReadOnly : false,
  
  dataType : 1
  
  },
  
  while debugging, I can see that flexsheet columns has header value assigned correctly, but while displaying, they are displaying the binding value in new version. Working perfectly fine in older version.

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 5 April 2019, 7:35 am EST

  Hello,

  We are sorry but we were not able to replicate the issue at our end. Please refer to the sample that we used to replicate the issue.

  https://stackblitz.com/edit/angular-5zpjfs

  Feel free to modify the sample so that it replicates the issue.

• 

  reeshabh.choudhary

  • Post Options:
  • Link
    Copy

  Posted 9 April 2019, 1:03 am EST - Updated 3 October 2022, 8:07 pm EST

  HI,
  
  I tried the code sample, now I am facing a few issues, such as, the index on left side is limited to 9. Please refer photo attached.

  

  941×579 45.1 KB

• 

  reeshabh.choudhary

  • Post Options:
  • Link
    Copy

  Posted 9 April 2019, 2:21 am EST

  Also please explain how do you use wijmo flexsheet columnLayout?

• 

  reeshabh.choudhary

  • Post Options:
  • Link
    Copy

  Posted 10 April 2019, 3:29 am EST

  Please check this :

   initFlexSheet(flex: wjcGridSheet.FlexSheet) {
      if(flex) {
        console.log(flex.itemsSource)
        flex.sheets.selectedIndex = 0;
        flex.columns.push(new wjcGrid.Column({
          header: 'Country',
          binding: 'country',
          isReadOnly: true
        }));
        flex.columns.push(new wjcGrid.Column({
          binding: 'amount',
          header: 'Total',
          isReadOnly: true
        }));
        this.source.items.forEach((item, index) => {
          flex.setCellData(index, 0, item.country);
          flex.setCellData(index, 1, item.amount);
        });
        flex.selectedSheet.columnCount = 10;
      }
    }
  

  itemsSource comes null. Even if you add click event to wijmo flexsheet after data is loaded and check, itemsSource will come as null for it.

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 10 April 2019, 6:15 am EST

  Index visible only up to 9

  The width of the row header is small, therefore indexes greater than 9 are truncated and shown as an ellipsis(…). You can use the autoSizeColumn method to resize the headers:

  flexSheet.autoSizeColumn(0, true);
  

  API Reference:

  https://demos.wijmo.com/5/Angular/WijmoHelp/WijmoHelp/topic/wijmo.grid.sheet.FlexSheet.Class.html#autoSizeColumn

  How to use columnLayout

  The columnLayout property is used to save the layout of the columns of flex sheet in JSON format.

  API Reference:

  https://demos.wijmo.com/5/Angular/WijmoHelp/WijmoHelp/topic/wijmo.grid.sheet.FlexSheet.Class.html#columnLayout

  Please refer to the demo below that shows how to columnLayout property:

  https://demos.wijmo.com/5/PureJS/LearnWijmo/LearnWijmo/#daxp8gm6

  Note: This demo is using wijmo FlexGrid but it is the same for FlexSheet