mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-06-04 21:40:23 -04:00
Both `<button type='submit'>Submit<button>` and `<input type='submit' value='Submit'>` can be used to submit a form. We have historically[1] used `<input>` because it’s better-supported by IE6 in that: - the `submit` attribute is mandatory on `<button>`, not on `<input>` - the `innerHTML` of a button will be submitted to the server, not the value (as in other browsers) Reasons to now use `<button>` instead: - IE6/7 support is no longer a concern (especially with deprecation of TLS 1.0 on the way) - Because an `<input>` element can’t have children, the pseudo-element hack[2] used to ensure the top edge of the button is clickable doesn’t work. We’re seeing this bug[3] affect real users in research. 1. We inhereted our buttons from Digital Marketplace, here is me making that change in their code:8df7e2e79e (diff-b1420f7b7a25657d849edf90a70ef541)2.24e1906c0d (diff-ef0e4eb6f1e90b44b0c3fe39dce274a4R79)3. https://github.com/alphagov/govuk_elements/issues/545
58 lines
2.0 KiB
HTML
58 lines
2.0 KiB
HTML
{% extends "withnav_template.html" %}
|
|
{% from "components/ajax-block.html" import ajax_block %}
|
|
{% from "components/message-count-label.html" import message_count_label, recipient_count_label %}
|
|
{% from "components/page-footer.html" import page_footer %}
|
|
{% from "components/textbox.html" import textbox %}
|
|
|
|
{% block service_page_title %}
|
|
{{ message_count_label(99, message_type, suffix='') | capitalize }}
|
|
{% endblock %}
|
|
|
|
{% block maincolumn_content %}
|
|
|
|
<h1 class="heading-large">
|
|
{{ message_count_label(99, message_type, suffix='') | capitalize }}
|
|
</h1>
|
|
{% if not message_type == "letter" %}
|
|
{{ ajax_block(
|
|
partials,
|
|
url_for('.get_notifications_as_json', service_id=current_service.id, message_type=message_type, status=status),
|
|
'counts'
|
|
) }}
|
|
|
|
<form
|
|
method="post"
|
|
action="{{ url_for('.view_notifications', service_id=current_service.id, message_type=message_type) }}"
|
|
class="grid-row"
|
|
>
|
|
<div class="column-three-quarters {% if message_type == 'sms' %}extra-tracking{% endif %}">
|
|
{{ textbox(
|
|
search_form.to,
|
|
width='1-1',
|
|
label='Search by {}'.format('email address' if message_type == 'email' else 'phone number')
|
|
) }}
|
|
</div>
|
|
<div class="column-one-quarter align-button-with-textbox">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
|
<button type="submit" class="button">Search</button>
|
|
</div>
|
|
</form>
|
|
|
|
<form id="search-form" method="post">
|
|
<input type="hidden" name="to" value="{{ search_form.to.data }}">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
|
</form>
|
|
{% else %}
|
|
<form id="search-form" method="post">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
|
|
</form>
|
|
{% endif %}
|
|
{{ ajax_block(
|
|
partials,
|
|
url_for('.get_notifications_as_json', service_id=current_service.id, message_type=message_type, status=status, page=page),
|
|
'notifications',
|
|
form='search-form'
|
|
) }}
|
|
|
|
{% endblock %}
|