36 lines
1.2 KiB
Text
36 lines
1.2 KiB
Text
[%# views/components/fancyselect.tt
|
|
|
|
Display a fancy select dropdown with custom styling and (optional) images
|
|
|
|
Authors:
|
|
Afuna <coder.dw@afunamatata.com>
|
|
|
|
Copyright (c) 2015 by Dreamwidth Studios, LLC.
|
|
|
|
This program is free software; you may redistribute it and/or modify it under
|
|
the same terms as Perl itself. For a copy of the license, please reference
|
|
'perldoc perlartistic' or 'perldoc perlgpl'.
|
|
%]
|
|
|
|
[%- dw.need_res( { group => "foundation" }
|
|
"js/components/jquery.fancy-select.js"
|
|
"stc/css/components/fancy-select.css"
|
|
) -%]
|
|
|
|
[%- SET id = id || "fancy-select-$name" -%]
|
|
<div class="fancy-select">
|
|
<label for="[%- id -%]">[%- label -%]</label>
|
|
<select id="[%- id -%]" name="[% name %]">
|
|
[%- FOR option IN items -%]
|
|
<option value="[%- option.value | html -%]"
|
|
[%- IF option.value == formdata.$name -%]
|
|
selected="selected"
|
|
[%- END -%]
|
|
[%- IF option.image -%]
|
|
data-fancyselect-img="[%- option.image.src | html -%]:[% option.image.width | html %]:[% option.image.height | html %]"
|
|
[%- END -%]
|
|
data-fancyselect-format="[%- ( option.format || option.label ) | html -%]"
|
|
>[%- option.label | html -%]</option>
|
|
[%- END -%]
|
|
</select>
|
|
</div>
|