mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-09-11 18:37:33 -04:00
Make autofocus textbox module
This commit adds a very small Javascript module to autofocus a textbox on page load. It should only be used once per page. It also adds a parameter to the textbox macro which adds the attribute to trigger autofocus.
This commit is contained in:
@@ -0,0 +1,12 @@
|
|||||||
|
(function(Modules) {
|
||||||
|
"use strict";
|
||||||
|
|
||||||
|
Modules.Autofocus = function() {
|
||||||
|
this.start = function(component) {
|
||||||
|
|
||||||
|
$('input, textarea, select', component).eq(0).trigger('focus');
|
||||||
|
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
})(window.GOVUK.Modules);
|
||||||
@@ -1,5 +1,13 @@
|
|||||||
{% macro textbox(field, hint=False, highlight_tags=False, help_link=None, help_link_text=None, width='2-3') %}
|
{% macro textbox(
|
||||||
<div class="form-group{% if field.errors %} error{% endif %}">
|
field,
|
||||||
|
hint=False,
|
||||||
|
highlight_tags=False,
|
||||||
|
autofocus=False,
|
||||||
|
help_link=None,
|
||||||
|
help_link_text=None,
|
||||||
|
width='2-3'
|
||||||
|
) %}
|
||||||
|
<div class="form-group{% if field.errors %} error{% endif %}" {% if autofocus %}data-module="autofocus"{% endif %}>
|
||||||
<label class="form-label" for="{{ field.name }}">
|
<label class="form-label" for="{{ field.name }}">
|
||||||
{{ field.label }}
|
{{ field.label }}
|
||||||
{% if hint %}
|
{% if hint %}
|
||||||
|
|||||||
@@ -35,6 +35,7 @@ gulp.task('javascripts', () => gulp
|
|||||||
paths.npm + 'govuk_frontend_toolkit/javascripts/govuk/modules.js',
|
paths.npm + 'govuk_frontend_toolkit/javascripts/govuk/modules.js',
|
||||||
paths.npm + 'govuk_frontend_toolkit/javascripts/govuk/selection-buttons.js',
|
paths.npm + 'govuk_frontend_toolkit/javascripts/govuk/selection-buttons.js',
|
||||||
paths.src + 'javascripts/apiKey.js',
|
paths.src + 'javascripts/apiKey.js',
|
||||||
|
paths.src + 'javascripts/autofocus.js',
|
||||||
paths.src + 'javascripts/highlightTags.js',
|
paths.src + 'javascripts/highlightTags.js',
|
||||||
paths.src + 'javascripts/main.js'
|
paths.src + 'javascripts/main.js'
|
||||||
])
|
])
|
||||||
|
|||||||
Reference in New Issue
Block a user