HubDB - Get and Output Column Name and Label

Highlighted
New Contributor

I am trying to create a dynamic experience where the output is dependant solely on the table. Is there a way to check if a column is empty, and if not, output the column name and column label?

 

This is how I want the code to work:

<div id="filters" class="button-group">
    <button class="button is-checked" data-filter="*">All Channels</button>
    {% for row in hubdb_table_rows(673165) %}
    {# if column is not empty, add this line #}<button class="button" data-filter="{# add column name #}">{# add column lable #}</button>
    {% endfor %}
</div>

 

This is what I would like the output to be:

<div id="filters" class="button-group">  
    <button class="button is-checked" data-filter="*">All Channels</button>
    <button class="button" data-filter=".Basic">Basic TV</button>
    <button class="button" data-filter=".ExpandedBasic">Expanded Basic</button>
    <button class="button" data-filter=".DigitalCable">Digital Cable</button>
    <button class="button" data-filter=".DigitalFamilyTier">Digital Family</button>
    <button class="button" data-filter=".HDBasicCable">HD Basic Cable</button>
    <button class="button" data-filter=".HDPremiumMovie">HD Premium Movie</button>
    <button class="button" data-filter=".DigitalPPV">Digital PPV</button>
    <button class="button" data-filter=".DigitalMusic">Digital Music</button>
</div>

Any idea? And please note that I would like to achieve this without messing with API.

 

Thanks,

Vivian

0 Upvotes
12 Replies 12
Highlighted
HubSpot Product Team

Hey @kuno-vivian are you still having trouble? If so please let me know and I'll get you connected with a design expert. 

0 Upvotes
Highlighted
New Contributor

@roisinkirby, I had to manually input this since it was for a client and there was deadline involved. However, I would still like a solution for this if possible!

 

Thanks,

Vivian

0 Upvotes
Highlighted
Occasional Contributor

Did you ever get an answer to this? I'm needing this. 

0 Upvotes
Highlighted
Community Manager

Hi @derekshelbyjone,

 

 I'm going to tag some thoughtleaders to see if they have some suggestions.

 

Hi @Kevin-C @Anton @Jon_McLaren, would you be able to share your thoughts on this?

 

Thanks,

Jess 

 


We are excited to announce that the Community will be launching a weekly newsletter on November 2, 2020!
Sign up today!
Highlighted
Regular Advisor | Partner

Hey @kuno-vivian 

 

So it looks like you're creating a filtering module, correct?

Interacting with the DB will be dependent on how the column's input is set up. i.e. multi-select, text/string, number etc.

 

Could you illustrate for us how you've got the HubDB table set up?

 

Highlighted
Occasional Contributor

Right, so I'm in the process of building a dynamic template across a hubdb MLS listings for boats.  Within the boat listing page, it would be beneficial if I could do a dynamic tag for the column name. Then, I would create an "if/then" statement, so if the listing does have data for the specific column, it won't print the column name. 

example of a short snippet

 

<div class="span4">

<h2>{{dynamic_page_hubdb_column.price}}</h2>
<h3>{{dynamic_page_hubdb_row.price}}</h3>
</div>
</div>

0 Upvotes
Highlighted
Regular Advisor | Partner

I'm still not sure I understand the usecase.

 

Maybe we can illustrate with the image below:

Screeenshot - 2020-05-27 at 4.17.55 PM.png

You're saying you want to get a column and print its name for each boat that is for sale. For example the "Role" column in the image above. If the row or "listing" has data in that "Role" column, then print that value in place of the column's name.

 

Applying that to the image:

For the first row it would print "CFO", and the second it would print "Role"

0 Upvotes
Highlighted
Occasional Contributor

here we can use the actual table

Edit table _ HubDB _ HubSpot - Google Chrome 5_27_2020 2_06_04 PM.png

So in this table, there's probably another 30 columns, but i would like it to print the column name, so lets say

print column.description: "Description"

print row.description: "LOA: 54 ft 11 in..." 

 

print column.length: " Length"

print row.length: "53ft 11in"

 

and so on.  so that on the dynamic page for each vessel it would display like

 
        <div class="col-sm-6">
          <p class="info-uppercase">Year:</p> {{dynamic_page_hubdb_column.year}}
          <p class="specs-bold">2009</p> {{dynamic_page_hubdb_row.year}}
        </div>
        
        <div class="col-sm-6">
          <p class="info-uppercase">Length:</p>{{dynamic_page_hubdb_column.length}}
          <p class="specs-bold">54 ft 11 in</p>{{dynamic_page_hubdb_row.length}}
        </div>
       
0 Upvotes
Highlighted
Regular Advisor | Partner

Hey @derekshelbyjone

 

Might this get you what you're looking for?

{% set table = hubdb_table_rows(xxxxxxx) %}
{% set cols = hubdb_table(xxxxxxx).columns %}
{% set colList = cols|map('name') %}

{# Display all Columns in the Table for dev purposes #}
{{ colList }}<br><br>

{# Loop through rows #}
{% for row in table %}

  {# Loop through columns in rows #}
  {% for col in colList %}
  
  {# If the row has a value #}
  {% if row[col] %} {# This if statement may need modified #}
		{# Print column name #}
		<h6>{{col}}</h6>
		{# Print row column value #}
		<h3>{{ row[col] }}</h3>
	{% endif %}

  {% endfor %}

{% endfor %}

EDIT:

Added conditional for printing column names and values

0 Upvotes
Highlighted
Occasional Contributor

I'm not a coder by trade. What would this look like for a dynamic page? currently, the top of my page is structured 

"{% set dynamic_page_hubdb_table_id =xxxxxxx %}"

 

Here is a rough version of my dynamic pages. Figuring out the design now. 

0 Upvotes
Highlighted
Regular Advisor | Partner

Hey @derekshelbyjone 

 

I'm assuming you've seen this article. Steps 4 and 5 will be the two that help you define this.

 

I would suggest getting the dynamic pages working first.

Followed by getting the data you need on those pages.

And finally styling the pages.

0 Upvotes
Highlighted
Occasional Contributor

of course... i currently have nearly 800 dynamic pages. now I'm building out the structure of where each column/specs goes. 

0 Upvotes