Anyone know how the dropdown filter card was made in the Domo Covid-19 public dashboard?
(Picture attached)
We're trying to make this card in our dashboard, as the UI seems vert clean. I could not find this card type in analyzer. Anyone knows if we can use custom web development to make this card, and then embed it in our instance dasahboard, and if yes then any resource to look at?
Best Answer
-
@hamza_123 yeah you can use a custom app to do anything!
Ryan O and his team are the folks that build custom apps in Domo, but I can show you how I did a similar thing.
In a nutshell, the pieces you'll need:
Domo Dev Studio prereqs (ryuu etc.)
https://developer.domo.com/docs/dev-studio/dev-studio-overview
Then:
SQL API to query the list of values from the source dataset (the contents of the dropdown menu)
https://developer.domo.com/docs/dev-studio-references/data-api#SQL%20API
You'll use a component like
https://getbootstrap.com/docs/4.0/components/dropdowns/
to render the dropdown menu and feed the contents in.
then when users make a selection, OnUpdate, you'll call a function that passes a "filter" message from your iFrame (the custom app) to window.parent and filters the dataset.
In the domoJS there's a method built-in, but you can obviously customize it if you're doing a multi-select.
https://developer.domo.com/docs/dev-studio-references/domo-js
domo.filterContainer = function (column, operator, values, dataType) {var userAgent = window.navigator.userAgent.toLowerCase(),safari = /safari/.test(userAgent),ios = /iphone|ipod|ipad/.test(userAgent);var message = JSON.stringify({event: 'filter',filter: {columnName: column,operator: operator,values: values,dataType: dataType,},});if (ios && !safari) {window.webkit.messageHandlers.domofilter.postMessage({column: column,operand: operator,values: values,dataType: dataType,});} else {window.parent.postMessage(message, '*');}};Jae Wilson
Check out my 🎥 Domo Training YouTube Channel 👨💻
**Say "Thanks" by clicking the ❤️ in the post that helped you.
**Please mark the post that solves your problem by clicking on "Accept as Solution"1
Answers
-
@hamza_123 yeah you can use a custom app to do anything!
Ryan O and his team are the folks that build custom apps in Domo, but I can show you how I did a similar thing.
In a nutshell, the pieces you'll need:
Domo Dev Studio prereqs (ryuu etc.)
https://developer.domo.com/docs/dev-studio/dev-studio-overview
Then:
SQL API to query the list of values from the source dataset (the contents of the dropdown menu)
https://developer.domo.com/docs/dev-studio-references/data-api#SQL%20API
You'll use a component like
https://getbootstrap.com/docs/4.0/components/dropdowns/
to render the dropdown menu and feed the contents in.
then when users make a selection, OnUpdate, you'll call a function that passes a "filter" message from your iFrame (the custom app) to window.parent and filters the dataset.
In the domoJS there's a method built-in, but you can obviously customize it if you're doing a multi-select.
https://developer.domo.com/docs/dev-studio-references/domo-js
domo.filterContainer = function (column, operator, values, dataType) {var userAgent = window.navigator.userAgent.toLowerCase(),safari = /safari/.test(userAgent),ios = /iphone|ipod|ipad/.test(userAgent);var message = JSON.stringify({event: 'filter',filter: {columnName: column,operator: operator,values: values,dataType: dataType,},});if (ios && !safari) {window.webkit.messageHandlers.domofilter.postMessage({column: column,operand: operator,values: values,dataType: dataType,});} else {window.parent.postMessage(message, '*');}};Jae Wilson
Check out my 🎥 Domo Training YouTube Channel 👨💻
**Say "Thanks" by clicking the ❤️ in the post that helped you.
**Please mark the post that solves your problem by clicking on "Accept as Solution"1
Categories
- All Categories
- 1.2K Product Ideas
- 1.2K Ideas Exchange
- 1.3K Connect
- 1.1K Connectors
- 273 Workbench
- 2 Cloud Amplifier
- 3 Federated
- 2.7K Transform
- 78 SQL DataFlows
- 525 Datasets
- 2.1K Magic ETL
- 2.9K Visualize
- 2.2K Charting
- 434 Beast Mode
- 22 Variables
- 511 Automate
- 114 Apps
- 389 APIs & Domo Developer
- 8 Workflows
- 26 Predict
- 10 Jupyter Workspaces
- 16 R & Python Tiles
- 332 Distribute
- 77 Domo Everywhere
- 255 Scheduled Reports
- 66 Manage
- 66 Governance & Security
- 1 Product Release Questions
- Community Forums
- 40 Getting Started
- 26 Community Member Introductions
- 68 Community Announcements
- 4.8K Archive