Using the HTML <details>
syntax it is possible to create drop down buttons that can display additional information relating to a specified grouping in Looker.
Say for example we wanted to display the total gross margin and create a drop down that showed the sales price and the purchase cost, by using the html field parameter with the <details>
tag you can achieve the functionality shown below:
Here is the LookML required to create the drop down:
measure: total_gross_margin {
type: sum
value_format_name: usd
sql: ${gross_margin} ;;
html: <div style="width:100%; text-align: centre;"> <details>
<summary style="outline:none">{{ total_gross_margin._linked_value }}</summary>
Sale Price: {{ total_sales_price._linked_value }}
<br/>
Inventory Costs: {{ inventory_items.total_cost._linked_value }}
</details>
</div>;;
}
What a cool pattern! Thanks for sharing, Marcus!
It is not working for me. can you help me?
Hi Aditi,
I think we covered this on chat today. Let us know anytime if you have any further question.
Best,
Hi @Marcus_O_Hanlon
It’s been almost a year now that at my company we’re using Looker.
There’s one thing that I believe is truly missing to enhance “dramatically” the UX.
Are you guys thinking about something similar around drop down measures but to be selected under the “filter” section ?
Hey Tovo, I’m a bit lost as to what you mean by that actually. Could you elaborate, maybe in a new topic in the Feature Requests section?
Just created 🙂
Can I add a drop down like above in my dimension?