Treeview in Spread Js for Web

Treeview in Spread Js for Web

Posted by: pooja.bansal on 23 July 2019, 11:58 pm EST

• 

  pooja.bansal

  • Post Options:
  • Link
    Copy

  Posted 23 July 2019, 11:58 pm EST - Updated 3 October 2022, 10:46 am EST

  Hi,

  We need a treeview in spread for web application in angular 7. Does that exists already?
  
  Requirements - Copy data from excel to treeview in spread. Export and import funtionality. Also get data in object from treeview in spread.

  PFA image for the reference.
  
  

  

  1291×438 118 KB

• 

  pooja.bansal

  • Post Options:
  • Link
    Copy

  Posted 24 July 2019, 1:42 am EST

  Hi,

  For now we need to show treeview in spread with dynamic data binding.
  
  Is that feasible in spread js 12?

  Regards
  
  Pooja Bansal

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 24 July 2019, 2:24 am EST

  Hi Pooja,

  Neither MS excel nor SpreadJS supports treeview. We could create treeview by creating row groups upto 8 levels.
  
  Also, in the attached image, it seems like the treeview is not an actual true but just a representation created using the text indentation/spaces. SpreadJS supports copy/paste data from excel and should be able to copy the tree created using indentation/spaces. However currently, there is a known issue regarding the copy/paste of indentation(Internal tracking ID: SJS-1064). We have added you as a correspondent for the case and will update you after the issue is fixed.

  Regards

• 

  pooja.bansal

  • Post Options:
  • Link
    Copy

  Posted 24 July 2019, 8:23 am EST

  Thanks for the reply.
  
  We would like to know how we can create tree view by creating row groups upto 8 levels with the dynamic binding of data.
  
  Could you please provide us with the sample code for that?

  Also, we are going to use treeview using row groups as suggested by you, not the intendation. The attached screenshot was just for a reference. Its not just a representation, we need to have treeview in spreadjs.

  Regards
  
  Pooja Bansal

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 25 July 2019, 12:40 am EST

  Please refer to the following samples which demonstrate how we could create groups in SpreadJS:
  
  https://www.grapecity.com/demos/spread/JS/TutorialSample/#/demos/basicGroup
  
  https://www.grapecity.com/demos/spread/JS/TutorialSample/#/demos/customizeGroup

  Also, please note that spreadJS does not support copy/paste row/column groups. However, if the excel sheet is imported or exported from spreadJS then row/column groups are also imported/exported correctly.

• 

  pooja.bansal

  • Post Options:
  • Link
    Copy

  Posted 25 July 2019, 1:09 am EST

  Hi,

  The above sample provides support for sheet.rowOutlines.group upto 8 levels right?
  
  Can you also provide the sample code for treeview with indentation in spread js?

  Regards
  
  Pooja Bansal

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 26 July 2019, 2:57 am EST

  Hi Pooja,

  The above sample provides support for sheet.rowOutlines.group upto 8 levels right?
  
  Yes, it demonstrates the same

  Can you also provide the sample code for treeview with indentation in spread js?
  
  Please refer to the following sample:
  
  https://codesandbox.io/s/spread-js-starter-kxub2

  Regards

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 29 July 2019, 7:16 am EST

  Hi Pooja,

  You could also use the outlineColumn feature of spreadJS to create a TreeView. Please refer to the following sample which demonstrates the same:
  
  https://www.grapecity.com/demos/spread/JS/TutorialSample/Features/Worksheet/outlineColumn/purejs

  Regards

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 7 August 2019, 3:23 am EST

  Hi Pooja,

  Regarding issue #SJS-1064 i.e copy-pasting text-indent from excel. DevTeam has confirmed that it a limitation and cannot be implemented. The reason being that when copy-pasting from excel, it is not possible to retrieve text-indent information from the system clipboard in some browsers so text-indent cannot be copy-pasted correctly from the excel.

  Regards