Skuid should process merge syntax in Button Icons, to allow for dynamic icons

  • 8
  • Idea
  • Updated 1 year ago
  • Implemented
Currently Skuid processes Mustache Merge syntax in Action/Button Labels and URLs, but not in Icons. If Skuid did process merge syntax in Icons, then different icons could be rendered depending on URL Parameters, Model data, etc.

For example, the following would result in different button icons being displayed depending on whether or not a "fs" parameter exists in the URL query string:



{{^$Param.fs}}ui-silk-arrow-inout{{/$Param.fs}}{{#$Param.fs}}ui-silk-arrow-in{{/$Param.fs}}
Photo of Zach McElrath

Zach McElrath, Employee

  • 49,056 Points 20k badge 2x thumb

Posted 5 years ago

  • 8
Photo of Thaddeus Ward

Thaddeus Ward

  • 736 Points 500 badge 2x thumb
Zach,
could this same logic be applied to tabs to change their appearance (Icon/color etc) based on data patterns?
Photo of Zach McElrath

Zach McElrath, Employee

  • 48,984 Points 20k badge 2x thumb
Yes, it should be possible to dynamically display different tab icons as well.
Photo of Zach McElrath

Zach McElrath, Employee

  • 49,056 Points 20k badge 2x thumb
This has been added in the Spring 14 release of Skuid.

In addition, we have added the ability to do true Conditional Rendering of Components based on data in your Models. So you can conditionally render Page Title Buttons, Table Row Actions, and Wizard Step Actions based on, for instance, whether an Opportunity is in a certain Stage, whether an Account's Billing Country is USA, US, or Canada, etc., or show different Row Actions based on the RecordType of the selected row, or show and hide Tabs in a Tabset based on conditions.

See this tutorial for more information:

http://help.skuidify.com/s/tutorials/...

and register for our Deep Dive webinar this Friday!

The new release is available now from www.skuidify.com/SkuidReleases
Photo of TJ

TJ

  • 952 Points 500 badge 2x thumb
Hi Zach,

Can I do this based on the value of fs parameter? Above works based on whether fs parameter exists or not in url. I want to show icon A when fs=A and icon B when fs=B.

Thanks!
Photo of Zach McElrath

Zach McElrath, Employee

  • 48,984 Points 20k badge 2x thumb
No, merge syntax doesn't allow value-based differentiation.

However, you could have 2 different buttons, each with their own icons, and then use Conditional Rendering to render each button conditionally based on the particular value of a URL Parameter. Conditional Rendering supports exact value comparisons against URL Parameter values.
Photo of TJ

TJ

  • 952 Points 500 badge 2x thumb
Yeap. That is what I thought.Thank you!
Photo of mB Pat Vachon

mB Pat Vachon, Champion

  • 42,714 Points 20k badge 2x thumb
Is this merge syntax dynamically updated as the values change in a model?

(($Model.Application.data.0.Contant_Info_Status_UI_Only}} for Conlan's post about conditional tab icons based on field values?
Photo of Zach McElrath

Zach McElrath, Employee

  • 49,056 Points 20k badge 2x thumb
I do not think so, no.