<div tal:define=" name name|field.name; style field.widget.style; oid oid|field.oid; css_class css_class|field.widget.css_class; optgroup_class optgroup_class|field.widget.optgroup_class; multiple multiple|field.widget.multiple;" tal:omit-tag=""> <input type="hidden" name="__start__" value="${name}:sequence" tal:condition="multiple" /> <select tal:attributes=" name name; id oid; class string: form-control ${css_class or ''}; data-placeholder field.widget.placeholder|None; multiple multiple; style style;"> <tal:loop tal:repeat="item values"> <optgroup tal:condition="isinstance(item, optgroup_class)" tal:attributes="label item.label"> <option tal:repeat="(value, description) item.options" tal:attributes=" selected (multiple and value in list(map(unicode, cstruct)) or value == list(map(unicode, cstruct))) and 'selected'; class css_class; label field.widget.long_label_generator and description; value value" tal:content="field.widget.long_label_generator and field.widget.long_label_generator(item.label, description) or description"/> </optgroup> <option tal:condition="not isinstance(item, optgroup_class)" tal:attributes=" selected (multiple and item[0] in list(map(unicode, cstruct)) or item[0] == unicode(cstruct)) and 'selected'; class css_class; value item[0]">${item[1]}</option> </tal:loop> </select> <script type="text/javascript"> deform.addCallback( '${field.oid}', function(oid) { $('#' + oid).select2({ containerCssClass: 'form-control drop-menu', dropdownCssClass: 'drop-menu-dropdown', dropdownAutoWidth: true, placeholder: "${str(field.widget.placeholder).replace('"','\\"')|""}", allowClear: true }); } ); </script> <input type="hidden" name="__end__" value="${name}:sequence" tal:condition="multiple" /> </div>