});
var context = $.extend({items: items}, options, state);
// Render the template.
- return templates.render('core/form_autocomplete_selection', context)
+ return templates.render('core/form_autocomplete_selection_items', context)
.then(function(html, js) {
// Add it to the page.
templates.replaceNodeContents(newSelection, html, js);
{{!
@template core/form_autocomplete_selection
- Moodle template for the currently selected items in an autocomplate form element.
+ Moodle template for the wrapper of currently selected items in an autocomplate form element.
Classes required for JS:
* none
Context variables required for this template:
* multiple True if this field allows multiple selections
* selectionId The dom id of the current selection list.
- * items List of items with label and value fields.
- * noSelectionString String to use when no items are selected
+ * items List of items with label and value fields (used by the partial).
+ * noSelectionString String to use when no items are selected (used by the partial).
Example context (json):
{ "multiple": true, "selectionId": 1, "items": [
}}
<div class="form-autocomplete-selection w-100 {{#multiple}}form-autocomplete-multiple{{/multiple}}" id="{{selectionId}}" role="list" aria-atomic="true" {{#multiple}}tabindex="0" aria-multiselectable="true"{{/multiple}}>
<span class="accesshide">{{#str}}selecteditems, form{{/str}}</span>
- {{#items}}
- <span role="listitem" data-value="{{value}}" aria-selected="true" class="badge badge-info mb-3 mr-1" style="font-size: 100%">
- <span aria-hidden="true">× </span>{{{label}}}
- </span>
- {{/items}}
- {{^items}}
- <span class="mb-3 mr-1">{{noSelectionString}}</span>
- {{/items}}
+ {{> core/form_autocomplete_selection_items }}
</div>
--- /dev/null
+{{!
+ This file is part of Moodle - http://moodle.org/
+
+ Moodle is free software: you can redistribute it and/or modify
+ it under the terms of the GNU General Public License as published by
+ the Free Software Foundation, either version 3 of the License, or
+ (at your option) any later version.
+
+ Moodle is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License
+ along with Moodle. If not, see <http://www.gnu.org/licenses/>.
+}}
+{{!
+ @template core/form_autocomplete_selection_items
+
+ Moodle template for the currently selected items in an autocomplate form element.
+
+ Classes required for JS:
+ * none
+
+ Data attributes required for JS:
+ * data-value
+
+ Context variables required for this template:
+ * items List of items with label and value fields.
+ * - value Value of the selected item.
+ * - label HTML representing the value.
+ * noSelectionString String to use when no items are selected
+
+ Example context (json):
+ { "items": [
+ { "label": "Item label with <strong>tags</strong>", "value": "5" },
+ { "label": "Another item label with <strong>tags</strong>", "value": "4" }
+ ], "noSelectionString": "No selection" }
+}}
+{{#items}}
+ <span role="listitem" data-value="{{value}}" aria-selected="true" class="badge badge-info mb-3 mr-1" style="font-size: 100%">
+ <span aria-hidden="true">× </span>{{{label}}}
+ </span>
+{{/items}}
+{{^items}}
+ <span class="mb-3 mr-1">{{noSelectionString}}</span>
+{{/items}}