Jump to content

Hide/Format groups in tabular datapage


Recommended Posts

I have a tabular datapage which essentially has the columns of Group, Name, Calc 1, Calc 2, Calc 3 and an Aggregation of Agg1 . The grouping is done by Group field and Agg 1 is shown at that level. Is there a way I can hide the entire grouping if Agg 1 does not meet a certain criteria? Likewise I would like to highlight specific rows in the expanded group based on values in one of the calc fields (varies depending on situation). In the example below, I would want to hide all of Group 1 (Group 1 row w/Agg1 as well as Name 1.1 and Name 1.2 rows) if Agg 1 is less than a designated threshold value. Is there a way to do this?

Group 1   Agg 1    
  Name 1.1 Calc 1 Calc2  Calc 3
  Name 1.2 Calc 1 Calc2  Calc 3
Group 2   Agg 1    
  Name 2.1 Calc 1 Calc2  Calc 3
  Name 2.2 Calc 1 Calc2  Calc 3
Link to comment
Share on other sites

  • 4 weeks later...

Hi @NickO,

It looks like it possible only with Collapsible group  --> Collapsed by default settings enabled:

bnUllLr.png

You may use the following JS if you have the same type in your Datapage:

<script type="text/javascript">

document.addEventListener('DataPageReady', hideRows);

function hideRows () {

document.querySelectorAll("td[class*='cbResultSetGroup1LabelCellNumberDate']").forEach(function (el) {
    
    if (el.innerHTML < 1000) { //replace this value with the one which you would like to set as target
        
        el.parentNode.style.display = 'none';
   
    }

});

document.removeEventListener('DataPageReady', hideRows);

}
</script>

Hope it helps.

Regards,

vitalikssssss

Link to comment
Share on other sites

  • 3 weeks later...

Apologies for the late reply @Vitalikssssss ... I am not sure how I missed this one. I have successfully hidden individual rows in the datapage where the value is zero, but the groups still show up. So, to illustrate. Instead of

Group 1   Agg 1    
  Name 1.1 Calc 1 Calc2  Calc 3
  Name 1.2 Calc 1 Calc2  Calc 3
Group 2   Agg 1    
  Name 2.1 Calc 1 Calc2  Calc 3
  Name 2.2 Calc 1 Calc2 

Calc 3

 

I have

Group 1   Agg 1    
Group 2   Agg 1    
         

I am trying to hide those aggregate lines of the datapage as well. Even with collapsible groups, it still shows the "group" level even if the individual rows are not visible. If there were a way to hide the aggregate row based on the value of the aggregate, I would be golden.

Link to comment
Share on other sites

@Vitalikssssss Hopefully the info below clarifies a little. The first is a screenshot of the report with no criteria selected (and the JS to hide empty rows disabled). The second is a report with criteria selected. 

I am currently able to hide rows in the "Solution Name" column based on criteria in hidden rows in the datapage. I would like to be able to hide rows at the Category Name and Product level conditionally based on the associated aggregate value (hiding it with CSS in second screenshot so it only shows aggregate at the product level, but it's there).

image.png.d78b038bdabac3ca28fbbe2335a03199.png

 

image.thumb.png.a7906aaf1ae83eb53779b5aba5cbee73.png

Link to comment
Share on other sites

Hi @NickO,

It would not be possible to write some generic code which would be easy to tweak, because Datapages with Groupping enabled has difference in HTML structure.

I have created a sample based on your screenshots and my understanding of the HTML structure. I have added a Total and Aggregation field which would be used as a criteria for hiding.

The report looks like the following without Javascript:
LDNYfTE.png

I have set the criteria in JS code to hide Category name and all rows within a group if Total is less than 70, so the Datapage looks like the following:

2odRa14.png

The JavaScript solution has been modified slightly compare to the first version:

<script type="text/javascript">

document.addEventListener('DataPageReady', hideRows);

function hideRows () {

document.querySelectorAll("td[class*='cbResultSetGroup1LabelCellNumberDate']").forEach(function (el) {
    

    if (el.innerHTML < 70) { //replace this value with the one which you would like to set as target
        
        el.parentNode.firstChild.click();
        el.parentNode.style.display = 'none';        
    }
});

document.removeEventListener('DataPageReady', hideRows);

}
</script>

Regards,

vitalikssssss 

Link to comment
Share on other sites

  • 4 weeks later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...