Move form templating logic to the ModalFormView
Below is a typical form:
{% extends "horizon/
{% load i18n %}
{% load url from future %}
{% block form_id %}update_
{% block form_action %}{% url 'horizon:
{% block modal-header %}{% trans "Update Role" %}{% endblock %}
{% block modal-body %}
<div class="left">
<fieldset>
{% include "horizon/
</fieldset>
</div>
<div class="right">
<h3>{% trans "Description" %}:</h3>
<p>{% trans "From here you can edit the role's details." %}</p>
</div>
{% endblock %}
{% block modal-footer %}
<a href="{% url 'horizon:
<input class="btn btn-primary" type="submit" value="{% trans "Update Role" %}"/>
{% endblock %}
-------
In a typical form, many variables such as id, action_url, success_url, cancel button, submit button are repeated. Currently, we are redefining these variables by overriding them using blocks. It is much cleaner to define these variables in python, and let the base modal_form.html populate them. That way, most of our logic is in one place and we would also reduce the clutter in the templates.
In addition, the left and right part of the modal is consistently use. It make sense for us to make that the default template, and let users override the right part while keeping the left. But we also need to retain the ability to override entire thing if required. Something like this should suffice:
<div class="modal-body clearfix">
{% block modal-body %}
<div class="left">
<fieldset>{% include "horizon/
</div>
<div class="right">
{% block modal-body-right %}{% endblock %}
</div>
{% endblock %}
</div>
-------
So what exactly am I proposing?
class ModalFormView:
id - the unique identifier of this form
name - the header of this form
action_url - the url to trigger the confirm action
success_url - the url to redirect for cancel action and success
confirm_label - the label for the confirm button
cancel_label - the label for the cancel button
Now a typical form can look like:
{% extends "horizon/
{% load i18n %}
{% load url from future %}
{% block modal-body-right %}
<h3>{% trans "Description" %}:</h3>
<p>{% trans "From here you can edit the role's details." %}</p>
{% endblock %}
Blueprint information
- Status:
- Complete
- Approver:
- David Lyle
- Priority:
- Medium
- Drafter:
- Thai Tran
- Direction:
- Approved
- Assignee:
- Thai Tran
- Definition:
- Approved
- Series goal:
- None
- Implementation:
- Implemented
- Milestone target:
- None
- Started by
- David Lyle
- Completed by
- Thai Tran
Related branches
Related bugs
Sprints
Whiteboard
Gerrit topic: https:/
Addressed by: https:/
Ability to add form confirm/cancel button labels
Gerrit topic: https:/
Addressed by: https:/
Align modal form buttons
2014-08-11 Timur Sufiev: could an ability to change modal form backdrop appearance and behavior also be implemented as part of this blueprint? By default modal form is closed after clicking outside of it on dark backdrop (attribute data-backdrop=
Addressed by: https:/
Ability to change modal form backdrop element behavior
2014-08-11 Thai Tran: that makes a lot of sense. Can definitely add that as part of blueprint.
Gerrit topic: https:/
Addressed by: https:/
Modal form cleanup
Addressed by: https:/
Clean modal forms in Idenity Groups
Addressed by: https:/
Clean modal forms in Idenity Users
Addressed by: https:/
Clean modal forms in Idenity Roles
Gerrit topic: https:/
Addressed by: https:/
Refactor horizon/
Addressed by: https:/
Clean modal forms for Images panel
Addressed by: https:/
Refactor modal forms for Networks
Addressed by: https:/
Refactor modal forms for Routers
Addressed by: https:/
Refactor modal forms for Subnets
Addressed by: https:/
Refactor modal forms for Nexus1000v
Addressed by: https:/
Refactor modal forms for Firewalls
Addressed by: https:/
Refactor modal forms for VPN
Addressed by: https:/
Refactor modal forms for Ports
Addressed by: https:/
Refactor modal forms for Load Balancers
Addressed by: https:/
Refactor modal forms for Volumes
Addressed by: https:/
Refactor modal forms for Settings dashboard
Addressed by: https:/
Refactor modal forms for Access & Security
Addressed by: https:/
Clean modal forms in Orchestration Stacks