mirror_php/moodle
1
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-04-13 12:32:08 +02:00
Code Issues Projects Releases Wiki Activity

MDL-62848 form: Fix width of the autocomplete input field

Browse Source 
Make sure that the autcomplete input field is wide enough to display the
placeholder text.
This commit is contained in:
David Mudrák 2018-07-16 21:50:49 +02:00
parent 5cdf8d49c7
commit c261ada88b
2 changed files with 20 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
lib/templates/form_autocomplete_input.mustache
View File

@ -41,3 +41,13 @@
{{^showSuggestions}}
<input type="text" id="{{inputId}}" placeholder="{{placeholder}}" role="textbox" aria-owns="{{selectionId}}"/>
{{/showSuggestions}}
{{#js}}
require(['jquery'], function($) {
// Set the minimum width of the input so that the placeholder is whole displayed.
var inputElement = $(document.getElementById('{{inputId}}'));
if (inputElement.length) {
inputElement.css('min-width', inputElement.attr('placeholder').length + 'ch');
}
});
{{/js}}

10
theme/boost/templates/core/form_autocomplete_input.mustache
View File

@ -41,3 +41,13 @@
{{^showSuggestions}}
<input type="text" id="{{inputId}}" placeholder="{{placeholder}}" role="textbox" aria-owns="{{selectionId}}"/>
{{/showSuggestions}}
{{#js}}
require(['jquery'], function($) {
// Set the minimum width of the input so that the placeholder is whole displayed.
var inputElement = $(document.getElementById('{{inputId}}'));
if (inputElement.length) {
inputElement.css('min-width', inputElement.attr('placeholder').length + 'ch');
}
});
{{/js}}