Hello, everyone!
Great tip by Jens about OptionModel attributes!
If you didn't need to have data-attributes, you could style the select
options using CSS attribute selectors:
option[value="fa-globe"]::before {
content: url(url/to/fa-globe/image.png)
...
}
On Thu, Nov 15, 2018 at 9:37 AM Jens Breitenstein <mailingl...@j-b-s.de>
wrote:
> Hi David/Ben
>
> The SelectModelRender makes use of attributes by
>
> ...
> writeAttributes(optionModel.getAttributes());
> ...
>
> And this method is implemented first in "AbstractOptionModel" and
> returns "null".
> So as Ben stated just adding the entry
>
> "data-icon" -> "glyphicon glyphicon-eye-open"
>
> to a map should in your OptionModel should do the trick.
>
> Jens
>
>
> Am 15.11.18 um 09:24 schrieb Ben Weidig:
> > Hi,
> >
> > as far as I can tell from the code and documentaion the class OptionModel
> > supports additional attributes with its .getAttributes() method. So you
> > should only need to implement your own OptionModel and build your
> > SelectModel with it.
> >
> > Hope this helps.
> >
> > Ben
> >
> > On Thu, Nov 15, 2018 at 7:23 JumpStart <
> geoff.callender.jumpst...@gmail.com>
> > wrote:
> >
> >> Very good question. I don’t know the answer, but here’s an idea…
> >>
> >> The Select component does not have a class parameter, but it does render
> >> informal parameters. So if you specify class=“selectpicker” then I’d
> expect
> >> it will be rendered with class=“selectpicker”. By default it renders the
> >> "select" element with class=“form-control”, so it might be best if you
> >> specify class=“form-control selectpicker”.
> >>
> >> As for overriding the rendering of the “option” element, I think we come
> >> unstuck. The difficulty I see is that OptionModel has only a label and
> >> value. You need label, image, and value.
> >>
> >> I think your best bet is to copy OptionModel and Select to new classes
> and
> >> and modify them suit your purposes. They aren’t long or complicated.
> >>
> >> HTH,
> >>
> >> Geoff
> >>
> >>> On 15 Nov 2018, at 1:30 pm, D. R. <d.re...@googlemail.com.INVALID>
> >> wrote:
> >>> Hi,
> >>>
> >>> how can i get control of the option elements within a t:select?
> >>>
> >>> I want to provide a unique data-icon property for each option.
> >>>
> >>> <t:select t:id="iconCode"
> >> t:model="literal:fa-globe=Globe,fa-flask=Flask,fa-user-tie=User-tie">
> >>> </t:select>
> >>>
> >>> will render:
> >>>
> >>> <select class="form-control" id="iconCode" name="iconCode">
> >>> <option value=""></option>
> >>> <option value="fa-globe">Globe</option>
> >>> <option value="fa-flask">Flask</option>
> >>> <option value="fa-user-tie">User-tie</option>
> >>> </select>
> >>>
> >>> i need something like
> >>>
> >>> <select class="selectpicker" id="iconCode">
> >>> <option data-icon="fa-globe">
> >>> Globe
> >>> </option>
> >>> <option data-icon="fa-flask">
> >>> Flask
> >>> </option>
> >>> <option data-icon="fa-user-tie">
> >>> User-tie
> >>> </option>
> >>> </select>
> >>>
> >>> i want to add class="selectpicker" to the t:select in order to let
> >> bootstrap convert the select to a dropdown with icons.
> >>> Kind regards
> >>> David
> >>>
> >>>
> >>> ---------------------------------------------------------------------
> >>> To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
> >>> For additional commands, e-mail: users-h...@tapestry.apache.org
> >>>
> >>
> >> ---------------------------------------------------------------------
> >> To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
> >> For additional commands, e-mail: users-h...@tapestry.apache.org
> >>
> >>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
> For additional commands, e-mail: users-h...@tapestry.apache.org
>
>
--
Thiago
