edit subscribers: Lift form tag to parent template.
For our Subscribers tab we want to enclose our
add-subscriber widget in a form for now, and we
continue to do so, but now we have the form tag
getting created in the parent template, not the
child.
Here is why:
We want to re-use our add-subscriber widget in an
upcoming commit for when you create streams.
In our create-stream UI, there is already an outer
<form>...</form> section of the HTML for the entire
process of creating a stream.
HTML does not yet you nest forms, and even though
browsers just silently ignore an inner form, we won't
want to create semantically incorrect HTML.
Therefore, we want the child template not to have
the form tags around them.
It's possible that we don't really even want to
enclose the input-pill widget and Add button inside
a form for the Subscribers tab, but tweaking that
for now is too risky. (We don't really take advantage
of the form tag in any meaningful way, since we
don't directly submit form data to the server, and
we can't use a single submit handler for the Enter
key and Add button due to some magic in our input
pills.)
2022-02-15 23:20:30 +01:00
|
|
|
<div class="add_subscribers_container">
|
|
|
|
<div class="pill-container person_picker">
|
|
|
|
<div class="input" contenteditable="true"
|
|
|
|
data-placeholder="{{t 'Add subscribers. Use usergroup or #streamname to bulk add subscribers.' }}">
|
|
|
|
{{~! Squash whitespace so that placeholder is displayed when empty. ~}}
|
2022-02-08 19:38:31 +01:00
|
|
|
</div>
|
|
|
|
</div>
|
edit subscribers: Lift form tag to parent template.
For our Subscribers tab we want to enclose our
add-subscriber widget in a form for now, and we
continue to do so, but now we have the form tag
getting created in the parent template, not the
child.
Here is why:
We want to re-use our add-subscriber widget in an
upcoming commit for when you create streams.
In our create-stream UI, there is already an outer
<form>...</form> section of the HTML for the entire
process of creating a stream.
HTML does not yet you nest forms, and even though
browsers just silently ignore an inner form, we won't
want to create semantically incorrect HTML.
Therefore, we want the child template not to have
the form tags around them.
It's possible that we don't really even want to
enclose the input-pill widget and Add button inside
a form for the Subscribers tab, but tweaking that
for now is too risky. (We don't really take advantage
of the form tag in any meaningful way, since we
don't directly submit form data to the server, and
we can't use a single submit handler for the Enter
key and Add button due to some magic in our input
pills.)
2022-02-15 23:20:30 +01:00
|
|
|
<div class="add_subscriber_btn_wrapper inline-block">
|
2022-02-08 18:56:40 +01:00
|
|
|
<button type="submit" name="add_subscriber" class="button add-subscriber-button small rounded sea-green" tabindex="0">
|
edit subscribers: Lift form tag to parent template.
For our Subscribers tab we want to enclose our
add-subscriber widget in a form for now, and we
continue to do so, but now we have the form tag
getting created in the parent template, not the
child.
Here is why:
We want to re-use our add-subscriber widget in an
upcoming commit for when you create streams.
In our create-stream UI, there is already an outer
<form>...</form> section of the HTML for the entire
process of creating a stream.
HTML does not yet you nest forms, and even though
browsers just silently ignore an inner form, we won't
want to create semantically incorrect HTML.
Therefore, we want the child template not to have
the form tags around them.
It's possible that we don't really even want to
enclose the input-pill widget and Add button inside
a form for the Subscribers tab, but tweaking that
for now is too risky. (We don't really take advantage
of the form tag in any meaningful way, since we
don't directly submit form data to the server, and
we can't use a single submit handler for the Enter
key and Add button due to some magic in our input
pills.)
2022-02-15 23:20:30 +01:00
|
|
|
{{t 'Add' }}
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</div>
|