added tmeplate macros and base template for forms

This commit is contained in:
Kyle Roux
2017-05-16 10:51:21 -07:00
parent ce763d6493
commit 8faabf9775
6 changed files with 79 additions and 87 deletions

View File

@ -1,12 +1,12 @@
<!DOCTYPE html>
<html lang="es">
<html lang="{{ lang }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{% block title %}{% endblock %} | Contacts Flask </title>
<link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet">
<link href="{{ url_for('static', filename='css/main.css') }}" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{% block title %}{% endblock %} | Contacts Flask </title>
<link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet">
<link href="{{ url_for('static', filename='css/main.css') }}" rel="stylesheet">
</head>
<body>
<nav class="navbar navbar-default">
@ -18,7 +18,7 @@
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Contactos</a>
<a class="navbar-brand" href="#">Contact Manager</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<form action="{{ url_for('search') }}" method="get" class="navbar-form navbar-left">
@ -39,7 +39,12 @@
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
{% for category, message in messages %}
<div class="alert alert-{{ category }}" role="alert">{{ message }}</div>
<div id="alert-{{ loop.index }}" class="alert alert-dismissable alert-{{ category }}" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true"><span class="glyphicon glyphicon-remove"></span></span>
</button>
{{ message }}
</div>
{% endfor %}
{% endif %}
{% endwith %}

View File

@ -0,0 +1,15 @@
{% macro render_field(field, kwargs) %}
{% if field.label.text != 'CSRF Token' and field.type != 'SubmitField' %}
<div class="form-group{%if field.errors %} has-error{% endif %}">
{% if field.label.text %}
{% if field.flags.required %}<span style="color:red; font-size:22px;">*</span>{% endif %} {{ field.label }}
{% endif %}
{{ field(**kwargs) }}
{% for error in field.errors %}
<span class="help-block">{{ error }}</span>
{% endfor %}
</div>
{% elif field.type == 'SubmitField' %}
{{ field(**kwargs) }}
{% endif %}
{% endmacro %}

View File

@ -0,0 +1,12 @@
{% extends 'layouts/master.html' %}
{% from "web/_macros.html" import render_field %}
{% block body %}
<h1>{{ self.title() }}</h1>
<form action="{% block form_action %}{% endblock %}" method="post">
{{ form.csrf_token }}
{% for field in form %}
{{ render_field(field, field._field_args) }}
{% endfor %}
</form>
{% endblock %}

View File

@ -1,37 +1,4 @@
{% extends 'layouts/master.html' %}
{% extends 'web/contact_form.html' %}
{% block title %}Edit contact{% endblock %}
{% block body %}
<h1>Edit contact</h1>
<form method="post">
{{ form.csrf_token }}
<div class="form-group{%if form.name.errors %} has-error{% endif %}">
{{ form.name.label }}
{{ form.name(class='form-control', value=my_contact.name) }}
{% for error in form.name.errors %}
<span class="help-block">{{ error }}</span>
{% endfor %}
</div>
<div class="form-group{%if form.surname.errors %} has-error{% endif %}">
{{ form.surname.label }}
{{ form.surname(class='form-control', value=my_contact.surname) }}
{% for error in form.surname.errors %}
<span class="help-block">{{ error }}</span>
{% endfor %}
</div>
<div class="form-group{%if form.email.errors %} has-error{% endif %}">
{{ form.email.label }}
{{ form.email(class='form-control', value=my_contact.email) }}
{% for error in form.email.errors %}
<span class="help-block">{{ error }}</span>
{% endfor %}
</div>
<div class="form-group{%if form.phone.errors %} has-error{% endif %}">
{{ form.phone.label }}
{{ form.phone(class='form-control', value=my_contact.phone) }}
{% for error in form.phone.errors %}
<span class="help-block">{{ error }}</span>
{% endfor %}
</div>
<input type="submit" class="btn btn-success" value="Save">
</form>
{% endblock %}
{% block form_action %}{{ url_for('edit_contact', id=contact_id) }}{% endblock %}

View File

@ -1,20 +1,3 @@
{% extends 'layouts/master.html' %}
{% extends 'web/contact_form.html' %}
{% block title %}New contact{% endblock %}
{% block body %}
<h1>New contact</h1>
<form action="{{ url_for('new_contact') }}" method="post">
{{ form.csrf_token }}
{% for field in form %}
{% if field.label.text != 'CSRF Token' %}
<div class="form-group{%if field.errors %} has-error{% endif %}">
{{ field.label }}
{{ field(class='form-control', value='') }}
{% for error in field.errors %}
<span class="help-block">{{ error }}</span>
{% endfor %}
</div>
{% endif %}
{% endfor %}
<input type="submit" class="btn btn-success" value="Add">
</form>
{% endblock %}
{% block form_action %}{{ url_for('new_contact') }}{% endblock %}