Using dataviewjs to hide empty tables

I’ve created callouts for tabletop RPG data that I pull in with meta-bind-embed.

The Vehicle Infobox note contains Setting Info:

Code for the “Variants Include” table:

> ```dataview  
> TABLE WITHOUT ID ModelsInclude AS "Variants Include"
> FROM "Mechanics"
> WHERE (file.name = this.file.name)
> ```

The Vehicle Stats Infobox not contains Vehicle Stats:
image

Code for the “Armament” and “Attachments” tables:

> ```dataview  
> TABLE WITHOUT ID Weapons AS "Armament"
> FROM "Mechanics"
> WHERE (file.name = this.file.name)
> ```
> ```dataview  
> TABLE WITHOUT ID Attachments AS "Attachments"
> FROM "Mechanics"
> WHERE (file.name = this.file.name)
> ```

The main note is called A-A4B Speeder Truck. Here is a snippet of the relevant properties as well as the subsequent meta-bind-embed calls that pull the infoboxes into the page, followed by the article text:
image

What I’m trying to do

I only want dataview tables (such as Variants Include, Armament, and Attachments) to appear if they contain a value. If there is no value, I want to hide the table entirely, like this for Vehicle Stats Infobox:
image

Things I have tried

I understand that dataviewjs is the way to do this, but my coding knowledge is woefully inadequate. I referred to Hide empty dataview queries but so far have been unable to repurpose the code. (I’m using the “Armament” table as a guinea pig - if I can get it to work there, I assume I can apply the same principle everywhere.)

Here’s the updated dataviewjs Armament table code in Vehicle Stats Infobox below. It replaces the original dataview Armament table code (seen above):

> ```dataviewjs
> // place your query here
> const query = `TABLE WITHOUT ID Weapons AS "Armament"
> FROM "Mechanics"
> WHERE (file.name = this.file.name)`
> 
> // executing the dataview query and return results
> let DQL = await dv.tryQuery(query);
> 
> // render the table only if any value
> if (DQL.values.length > 0){
> 	dv.table(DQL.headers, DQL.values)
> }
> ```

When rendering Vehicle Stats Infobox in Reading mode, a note with no properties whatsoever, the table is correctly absent - yet when I add the Weapons property with a dummy entry, the table never appears.

However, when rendering the A-A4B Speeder Truck note in Reading mode, the table header is always present, even when the Weapons property is empty. Adding a dummy entry correctly updates the table:
image

I’m not entirely sure where to go from here. I tried returning DQL.values.length to troubleshoot but got no results, no matter what I tried. I fear my dataviewjs/JavaScript knowledge is too basic. Any ideas?

With your current query, what happens if you after the update of the value open the command pallete, and execute Dataview: Rebuild current view ?

If it appears after that command you’ve got an issue related to cache updates and queries which haven’t been resolved yet.

If you can’t find that command, you’ll need to update your Dataview plugin.

Thanks for your response! First off, I had no idea the Command Palette existed before now. It seems extremely useful.

I tried what you suggested. In the A-A4B Speeder Truck note, if I add anything to the Weapons property, it shows up correctly after running the Dataview: Rebuild current view OR hitting the 2500 ms refresh interval, whatever comes first.

Clearing the property also correctly removes it from the table when it hits 2500ms/when I run the command.
image

Unfortunately, the Armament table header remains.

Additional Things I Tried

Separately, I poked at the Vehicle Stats Infobox note I’m calling with meta-bind-embed to see if I could figure out why it wasn’t showing any Armament table values. Once again, I added a Weapons property to the note. This is the note’s code with the original Armament table code added to the end as a control:

---
Weapons:
  - Test
---

>[!metadata|bg-c-gray]+ Vehicle Sheet
>  
> |  |  |  |
> |:---:|:---:|:---:|
> |`=choice(this.Silhouette, this.Silhouette, "0")`|`=choice(this.Speed, this.Speed, "N/A")`|`=choice(this.Handling, this.Handling, "+0")`|
> | **SIL** | **SPD**| **HND**|
> |  |  |  |
> | **ARM** | **HT** | **SS**|
> |`=choice(this.Armor, this.Armor, "0")`|`=choice(this.HTThresh, this.HTThresh, "N/A")`|`=choice(this.SSThresh, this.SSThresh, "N/A")`|
> ```dataviewjs
> // place your query here
> const query = `TABLE WITHOUT ID Weapons AS "Armament"
> FROM "Mechanics"
> WHERE (file.name = this.file.name)`
> 
> // executing the dataview query and return results
> let DQL = await dv.tryQuery(query);
> 
> // render the table only if any value
> if (DQL.values.length > 0){
> 	dv.table(DQL.headers, DQL.values)
> }
> ```
> ```dataview  
> TABLE WITHOUT ID Attachments AS "Attachments"
> FROM "Mechanics"
> WHERE (file.name = this.file.name)
> ```
> ```dataview  
> // Original Armament table code
> TABLE WITHOUT ID Weapons AS "Armament"
> FROM "Mechanics"
> WHERE (file.name = this.file.name)
> ```

Strangely enough, when rendered neither the hidden Armament table nor the original code displays correctly.
image

Adding any of the non-dataview table properties to Vehicle Stats Infobox, such as the Silhouette property, correctly updates on a rebuild (or simply leaving and returning to the note).

Thoughts

In the Vehicle Stats Infobox, the dataviewjs code correctly hides the header, which is good–but it also fails to display any Weapons values. However, this appears to be because no Weapons values are displaying in this note, whether in the newer dataviewjs Armament code or the original dataview Armament code.

  • Could “WHERE (file.name = this.file.name)” is part of the issue? I’m not sure why it displays values correctly in any other Vehicle note but this one.
  • Is something strange happening with meta-bind-embed/callout box interaction?

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.