55 lines
1.6 KiB
Smarty
55 lines
1.6 KiB
Smarty
|
<select name="recipient" class="form-control input-lg" id="recipient">
|
||
|
{{foreach $contacts as $contact}}
|
||
|
<option value="{{$contact.id}}"{{if $contact.id == $selected}} selected{{/if}}>{{$contact.name}}</option>
|
||
|
{{/foreach}}
|
||
|
</select>
|
||
|
<script type="text/javascript">
|
||
|
$(function() {
|
||
|
let $recipient_input = $('[name="recipient"]');
|
||
|
|
||
|
let acl = new Bloodhound({
|
||
|
local: {{$contacts|@json_encode nofilter}},
|
||
|
identify: function(obj) { return obj.id.toString(); },
|
||
|
datumTokenizer: Bloodhound.tokenizers.obj.whitespace(['name', 'addr']),
|
||
|
queryTokenizer: Bloodhound.tokenizers.whitespace,
|
||
|
sorter: function (itemA, itemB) {
|
||
|
if (itemA.name === itemB.name) {
|
||
|
return 0;
|
||
|
} else if (itemA.name > itemB.name) {
|
||
|
return 1;
|
||
|
} else {
|
||
|
return -1;
|
||
|
}
|
||
|
},
|
||
|
});
|
||
|
acl.initialize();
|
||
|
|
||
|
let suggestionTemplate = function (item) {
|
||
|
return '<div><img src="' + item.micro + '" alt="" style="float: left; width: auto; height: 2.8em; margin-right: 0.5em;"><p style="margin-left: 3.3em;"><strong>' + item.name + '</strong><br /><em>' + item.addr + '</em></p></div>';
|
||
|
};
|
||
|
|
||
|
$recipient_input.tagsinput({
|
||
|
confirmKeys: [13, 44],
|
||
|
freeInput: false,
|
||
|
tagClass: 'label label-info',
|
||
|
itemValue: function (item) { return item.id.toString(); },
|
||
|
itemText: 'name',
|
||
|
itemThumb: 'micro',
|
||
|
itemTitle: function(item) {
|
||
|
return item.addr;
|
||
|
},
|
||
|
typeaheadjs: {
|
||
|
name: 'contacts',
|
||
|
displayKey: 'name',
|
||
|
templates: {
|
||
|
suggestion: suggestionTemplate
|
||
|
},
|
||
|
source: acl.ttAdapter()
|
||
|
}
|
||
|
});
|
||
|
|
||
|
// Import existing ACL into the tags input fields.
|
||
|
$recipient_input.tagsinput('add', acl.get({{$selected}})[0]);
|
||
|
});
|
||
|
</script>
|