Hiding a Table Block If No Results Found

I know the code below works to hide a list details block that returns no data, but is it possible to leverage this code to hide a table block?

<script>
window.addEventListener('get-record-list1', (e) => {
if (!e.detail.id) {
document.getElementById('list1').classList.add('d-none');
}
});
</script>

Hi, in order to have the same results for a table block, this one should work

<script>
  const onRecords = (e) => {
    const table1 = document.getElementById('table1');
    if (e.detail && e.detail.length > 0) {
      table1.style.display = 'block';
    } else {
      table1.style.display = 'none';
    }
  };

  window.addEventListener('get-records-table1', onRecords);
</script>

Careful, it will also hide the block when choosing an inline filter or typing something in the search bar that gives 0 result

2 Likes

Much appreciated!!! :clap: