Hide/Show a group of rows

Posted by: johina.olla on 25 May 2021, 7:07 pm EST

    • Post Options:
    • Link

    Posted 25 May 2021, 7:07 pm EST - Updated 3 October 2022, 12:47 am EST

    We are using spreadJS 14, and providing a functionality of “Row-set” by which user can add row-set in the sheet and marks the different rows corresponds to the newly added row-set(test1,test2) as shown in screenshot.

    Based on the selected row set only rows which are marked under that row set should be visible and rest should be hidden.

    For Example

    we have added 3 row-set (Basic-row-set, test1, test2) in view tab under ribbon.

    Basic row set :- No marked row , all rows should visible if selected(default rowset).

    test1: - few marked row

    ex. markedrow[4,5,7,8,10,11,12].

    Only these rows should be visible.

    test2: - few marked row

    ex. markedrow[100, 105,110,135,145,156,700,810].

    Only these rows should be visible.

    In this sheet, we have 5254 rows and can be more in other sheet. We have selected the ‘test1’ rowset and only those rows are visible which are under marked rows. So, we use the traditional ‘for-loop’ to show or hide the rows in spread using “setRowVisible” method as shown in code.

    var startRow = area.AreaBeginRow;

    var endRow = area.AreaEndRow;

    var hideRows = sheet.HiddenRowsTable;

    var dataBeginRow = area.DataBeginRow;

      for (var i = startRow; i <= endRow; i++) {
        var row = i;
    
        var MarkedRow = _.find(rowSet.MarkedRows, function (o) { return o == i; });
    
        if (MarkedRow != undefined || sheet.DefaultRowSet) {
            this.hideShowRow(activeSheet, row, true);
          }
        else {
          this.hideShowRow(activeSheet, row, false);
        }
        
      }
    

    private hideShowRow(sheet: any, row: number, show: boolean): void {

    sheet.setRowVisible(row, show);

    }

    In this case for -loop is taking time(2-3 mins or more depends on no. of rows ) to evaluate this row set functionality.

    Please suggest, if there is any other way to show / hide the groups of row in one go/ or without looping.

  • Posted 26 May 2021, 6:17 pm EST

    Hi,

    You may use the visible method and on the Range object. please refer to the following code snippet and let us know if you face any issues.

    
    spread.getActiveSheet().getRange(rowIndex,-1,rowCount,-1).visible(false)
    
    

    Further, hiding/unhiding these many rows should not take this much of time. Could you please provide a small sample that replicates the issue so that we could investigate it further and assist you accordingly? Also make you follow the bestpractise to increase the performance. Please refer to the following docs regarding the same.

    Best Practises for increasing performance: https://www.grapecity.com/spreadjs/docs/v14/online/BestPractices.html?highlight=best%2C

    API References:

    visible:https://www.grapecity.com/spreadjs/docs/v14/online/SpreadJS~GC.Spread.Sheets.CellRange~visible.html

    getRange https://www.grapecity.com/spreadjs/docs/v14/online/SpreadJS~GC.Spread.Sheets.Worksheet~getRange.html

    Regards

    Avinash

  • Posted 27 May 2021, 7:53 pm EST

    Hi Avinash,

    In our case, rows can be random in the marked row array (as I mentioned in previous comment). So cannot pass a range for rows in the method you suggested,

    spread.getActiveSheet().getRange(rowIndex,-1,rowCount,-1).visible(false)

    Secondly, I tried to hide all rows from sheet in one go by using this method, I found it is taking more time (approx. 3 -4 min) than ‘For-Loop’ which I was using earlier.

    ex. activeSheet.getRange(4, -1, 4800, -1). visible(false)

    Could you please suggest is there any other way to hide all rows except header rows?

    Thanks

    Johina Olla

  • Posted 30 May 2021, 10:55 pm EST

    Hi Jhoinam,

    We are sorry but there is no other available for the required functionality.

    Regarding the Performance issue:

    We are unable to replicate the issue at our end. Could you please provide a small sample or sample file on which you are facing this issue so that we could investigate it further and assist you accordingly? you may also modify the following sample to replicate the issue.

    sample:https://codesandbox.io/s/laughing-gould-646eu?file=/src/index.js

    Regards

    Avinash

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels