Hide components when there are no records

Here is a little snippet of JavaScript you can add to a page that will hide a Data Component if there are no records to display.

TB.render('component_3', function(data) {   
    if (data.records === undefined || data.records.length === 0) {
    data.ele.css('display','none')
    }
});

You will need to replace ‘component_3’ with the component you want to hide. You can get the ID by hovering your cursor over the information icon on a component.

3 Likes

Very helpful and appreciated.

1 Like

Hey @tim.young, can you show or hide components using the Component ID with CSS or do you still have to use the x_element_page_id ?

Component ID is only for use with our JavaScript API. For CSS, you’ll need to target a selector such as an ID or class, so exactly what you mentioned :+1:

1 Like