picker-template.html 1.78 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58
<%
var picker_id = (pickerAttributes['id'] != null ? 'id="' + pickerAttributes['id'] + '"' : '');
var picker_class = (pickerAttributes['class'] != null ? pickerAttributes['class'] + ' ' : '');
var picker_attr = '';

if (pickerAttributes['attr']) {
    _.each(pickerAttributes['attr'], function(value, key) {
	picker_attr += ' ' + key + '="' + value + '"';
    });
}
%>

<div <%= picker_id %> class="picker btn-group <%= picker_class %>" <%= picker_attr %>>
    <button type="button" class="form-control btn btn-default dropdown-toggle" data-toggle="dropdown">
	<span class="value"></span>
	<span class="caret"></span>
    </button>
    <ul class="dropdown-menu" role="menu">
	<% _.each(items, function(group) {
	    if (group['info'] && group['elements'].length > 0) { 
		var dividerClass = group['info']['key'] + '_divider'
		var dividerText = ''
		var textClass = ''

		if (group['info']['text']) {
		    dividerText = '<div>'+group['info']['text']+'</div>';
		    textClass = ' withText';
		}
		%>
		<li class="<%= dividerClass %><%= textClass %> divider" role="separator">
		    <%= dividerText %>
		</li>
	    <%}

	    _.each(group['elements'], function(element) {
		var element_attr = '';
		_.each(element['attr'], function(value, key) {
		    element_attr += ' ' + key + '="' + value + '"';
		});%>
		<li class="<%= element['class'] %>" <%= element_attr %>>
		    <a href="#" value="<%= element['value'] %>"
			<% if (element['tooltip']) { 
			    var placement = 'right';
			    if (element['tooltip']['placement']) {
				placement = element['tooltip']['placement'];
			    }%>
			    data-toggle="tooltip"
			    data-placement="<%= placement %>"
			    data-html="true"
			    title="<%= element['tooltip']['title'] %>"
			<% } %> >
			<%= element['html'] %>
		    </a>
		</li>
	    <%});
	});%>
    </ul>
</div>