diff --git a/webapp/app/forms/fields.py b/webapp/app/forms/fields.py index af3740e32..4aa98a689 100644 --- a/webapp/app/forms/fields.py +++ b/webapp/app/forms/fields.py @@ -15,25 +15,36 @@ from app.forms.validators import ValidElsterCharacterSet +class BaselineBugFixMixin: + """ Safari and Firefox have a bug where empty input fields do not align correctly with baseline alignment. The reason is that + if an input field is empty its bottom border is used as the baseline instead of the baseline of the text input. + This can be fixed by setting a placeholder text. """ + + def __call__(self, field, **kwargs): + # Safari and Firefox have has a bug where empty input fields do not align correctly with baseline alignment. + # Thus, we add a placeholder. + kwargs.setdefault('placeholder', ' ') + return kwargs + + class SteuerlotseStringField(StringField): def pre_validate(self, form): ValidElsterCharacterSet().__call__(form, self) -class MultipleInputFieldWidget(TextInput): +class MultipleInputFieldWidget(TextInput, BaselineBugFixMixin): """A divided input field.""" sub_field_separator = '' input_field_lengths = [] input_field_labels = [] def __call__(self, field, **kwargs): + kwargs = BaselineBugFixMixin.__call__(self, field, **kwargs) + if 'required' not in kwargs and 'required' in getattr(field, 'flags', []): kwargs['required'] = True kwargs['class'] = 'form-control' - # Safari has a bug where empty input fields do not align correctly with baseline alignment. - # Thus, we add a placeholder. - kwargs['placeholder'] = ' ' joined_input_fields = Markup() for idx, input_field_length in enumerate(self.input_field_lengths): @@ -232,7 +243,7 @@ def __init__(self, label=None, false_values=None, input_required=True, **kwargs) ) -class JqueryEntriesWidget(object): +class JqueryEntriesWidget(BaselineBugFixMixin, object): """A custom multi-entry widget that is based on jquery.""" html_params = staticmethod(html_params) @@ -240,6 +251,7 @@ def __init__(self): self.input_type = None def __call__(self, field, **kwargs): + kwargs = super().__call__(field, **kwargs) kwargs.setdefault('id', field.id) kwargs.setdefault('data', field.data) kwargs.setdefault('split_chars', field.split_chars) diff --git a/webapp/app/templates/fields/jquery_entries.html b/webapp/app/templates/fields/jquery_entries.html index bba184834..520b4b562 100644 --- a/webapp/app/templates/fields/jquery_entries.html +++ b/webapp/app/templates/fields/jquery_entries.html @@ -9,11 +9,12 @@ {% endif %} {% macro remove_button() %}{% endmacro -%} + +{% macro entry(kwargs, item=None) %}
{{remove_button()}}
{% endmacro %} +
{%- for item in kwargs['data'] %} -
- {{remove_button()}} -
+ {{ entry(kwargs, item) }} {%- endfor -%}
@@ -30,7 +31,7 @@ $('#{{id}}-add').on('click', function (event) { event.preventDefault(); - $app.append($('
{{remove_button()}}
')) + $app.append($('{{entry(kwargs)}}')) .find('input').focus(); });