Re: data-icon for option within t:select

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 <[email protected]>
> 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. <[email protected]>
>> 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: [email protected]
>>> For additional commands, e-mail: [email protected]
>>>
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: [email protected]
>> For additional commands, e-mail: [email protected]
>>
>>


---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]