CMS Development

eugenio_rossi
Contributor | Platinum Partner
Contributor | Platinum Partner

Filtering HubDB as button

Hi,

I just created and succesfully printed out the results wanted for several tables on my website, but I'm struggling in creating a filtering elements to filter the date (years more specifically), of the single rows.

 

Basically I would need something like this:

eugenio_rossi_0-1603440762066.png

(this from the live environment, which I should migrate)

 

But when it comes to trying to append filter in GET, managing the Url which I attach as follows:

https://dev.txtgroup.com/governance/share-buy-back/&published_date__gt=2020-01-01

Nothing happens: what am I missing: I basically would need to create a way to filter out the results (a module to be used in different pages would be great).

Thx for any answer or suggestion you may provide me.

 

6 Replies 6
dennisedson
HubSpot Product Team
HubSpot Product Team

Filtering HubDB as button

hello @eugenio_rossi !

Thanks for the code. 

Going to tag in some smart folks who might be able to help here!

@John , @AlexanderData , @mii do you all have any thoughts on this issue?

 

eugenio_rossi
Contributor | Platinum Partner
Contributor | Platinum Partner

Filtering HubDB as button

Just to add some code, that maybe can be helpful for helping me. This is the code I've so far, to print the table.

<!-- Table & List Print -->

{% set table_info = module.hubdbtable_field %}

<div class="flex-container">
{% for row in hubdb_table_rows(table_info, queryparam) %}
  
  <div class="cell">
  <div class="cell-inner">
    <a href="{{row.resource_link}}" target="_blank">
      <div class="data-banner">
        <span><img src="https://f.hubspotusercontent30.net/hubfs/7532984/TXT_Corp_Comm_Investor_Club/other/icon_news_TXT.svg">{{row.published_date|datetimeformat('%B %e, %Y')}}</span>
      </div>
      <h4 class="single-title-cell">{{row.title}}</h4>
      <span class="download-icon"></span>
    </a>
    </div>
  </div>
{% endfor %}
</div>

 

If you have any advice, it would be more than helpful. 🙂

mii
Contributor | Platinum Partner
Contributor | Platinum Partner

Filtering HubDB as button

Hello Rossi, Hi Dennis,

easily done with the query param and a little help of unix-timestamp formatting; here you go:

The HubDB as Reference: 
Usage HubDB: https://developers.hubspot.com/docs/cms/features/hubdb
datetime_hubdb.png

And the Hubl-Filter to get 2020 from Date Field:
String to time: https://developers.hubspot.com/docs/cms/hubl/filters#strtotime
List of all filters: https://legacydocs.hubspot.com/docs/methods/hubdb/v2/get_table_rows

 

 

{% set table_info = module.hubdbtable_field %}

{% set from = "2019-06-05T14:31:30+0530"|strtotime("yyyy-MM-dd'T'HH:mm:ssZ")|unixtimestamp %}
{% set to = "2021-03-11T14:31:30+0530"|strtotime("yyyy-MM-dd'T'HH:mm:ssZ")|unixtimestamp %}
{% set queryparam = "published_date__gt="+ from +"&published_date__lt="+to %}

{% for row in hubdb_table_rows(table_info, queryparam) %}
  <div>
     <span>{{row.published_date|datetimeformat('%B %e, %Y')}}</span>
  </div>
{% endfor %}

 

 

 
Result is: November 6, 2020

Additional Helper: 
If you need the filter from the URL, you can use the request.query_dict object.
But take care of a fallback or handle it otherwise. Also the filters: minus_time() and plus_time() may be helpful:

 

{% set query = request.query_dict.published_date != null ? request.query_dict.published_date : "2020-01-01" %}

 


Another cool thing is, if you output all rows, add classnames for dates and filter the items with a masory script like Isotope.

Have fun, greetings, mii

eugenio_rossi
Contributor | Platinum Partner
Contributor | Platinum Partner

Filtering HubDB as button

Any advice from your end?
Let me know, please. It is a pivotal feature to add on several pages.

 

BR.

dennisedson
HubSpot Product Team
HubSpot Product Team

Filtering HubDB as button

Hello @eugenio_rossi ,

Welcome to the Community!

Are you still having issues with this?  I went to the site and it appears that the filter is working

 

eugenio_rossi
Contributor | Platinum Partner
Contributor | Platinum Partner

Filtering HubDB as button

Hi Dennis,

 

Nope: actually I was not able to figure it out.
The page that prints the table is the following one: https://dev.txtgroup.com/governance/share-buy-back/

The column which I'd like to filter is the published_date column.

Any advice on how? 🙂


Thx