MDL-55417 forms: Render form elements with a template
[moodle.git] / theme / noname / templates / core_form / element-autocomplete.mustache
CommitLineData
91bda4cd
DW
1<div class="form-group row {{#error}}has-danger{{/error}}">
2 <label class="col-md-3 col-form-label" for="{{element.id}}">
3 {{{label}}} {{{helpbutton}}}
4 </label>
5 <div class="col-md-9 form-inline">
6 <select class="custom-select {{#error}}form-control-danger{{/error}}" name="{{element.name}}"
7 id="{{element.id}}"
8 {{#element.multiple}}multiple{{/element.multiple}}
9 {{#element.frozen}}readonly disabled{{/element.frozen}}
10 {{#error}}
11 autofocus aria-describedby="id_error_{{element.name}}"
12 {{/error}}
13 {{#element.attributes}}
14 {{name}}={{#quote}}{{value}}{{/quote}} ddd
15 {{/element.attributes}}
16 >
17 {{#element.options}}
18 <option value="{{value}}" {{#selected}}selected{{/selected}}>{{text}}</option>
19 {{/element.options}}
20 </select>
21 <div class="form-control-feedback" id="id_error_{{element.name}}" {{^error}} style="display: none;"{{/error}}>
22 {{{error}}}
23 </div>
24 </div>
25</div>
26{{#js}}
27require(['jquery', 'core/event'], function($, Event) {
28 var element = document.getElementById('{{element.id}}');
29 $(element).on(Event.Events.FORM_FIELD_VALIDATION, function(event, msg) {
30 event.preventDefault();
31 var parent = $(element).closest('.form-group');
32 var feedback = parent.find('.form-control-feedback');
33 if (msg !== '') {
34 parent.addClass('has-danger');
35 $(element).addClass('form-control-danger');
36 $(element).attr('aria-describedby', $(element).attr('id') + '-feedback');
37 feedback.html(msg);
38 feedback.show();
39 } else {
40 parent.removeClass('has-danger');
41 $(element).removeClass('form-control-danger');
42 $(element).attr('aria-describedby', '');
43 feedback.hide();
44 }
45 });
46});
47{{/js}}