104 lines
4.1 KiB
HTML
104 lines
4.1 KiB
HTML
{% extends "layout/layout.html" %}
|
|
{% from "forms/validation-block.html" import form_field_validation %}
|
|
{% from "forms/submit-btn.html" import form_submit_button %}
|
|
{% from "layout/inner_header.html" import inner_header%}
|
|
{% block title %} register {% endblock %}
|
|
{% block head %}
|
|
{{ super() }}
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/register.css') }}">
|
|
{% endblock %}
|
|
{% block content %}
|
|
<div class="container">
|
|
<div class="register mx-auto">
|
|
<div class="my-3">
|
|
{{ inner_header("Register") }}
|
|
</div>
|
|
<div class="row px-2">
|
|
{% include 'message.html' %}
|
|
</div>
|
|
<form class="row g-3 needs-validation" method="post" novalidate>
|
|
<div class="col-12">
|
|
<label class="form-label" for="name">Name</label>
|
|
<input
|
|
class="form-control"
|
|
id="name"
|
|
maxlength="255"
|
|
name="name"
|
|
pattern="[A-Za-z ]{2,255}"
|
|
placeholder="Enter your name"
|
|
required
|
|
type="text"
|
|
>
|
|
{{ form_field_validation(FORM_ERRORS['REQUIRED'] + " " + FORM_ERRORS['NAME_FORMAT']) }}
|
|
</div>
|
|
<div class="col-12">
|
|
<label class="form-label" for="lastname">Lastname</label>
|
|
<input
|
|
class="form-control"
|
|
id="lastname"
|
|
maxlength="255"
|
|
name="lastname"
|
|
pattern="[A-Za-z ]{2,255}"
|
|
placeholder="Enter your lastname"
|
|
required
|
|
type="text"
|
|
>
|
|
{{ form_field_validation(FORM_ERRORS['REQUIRED'] + " " + FORM_ERRORS['NAME_FORMAT']) }}
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" for="birthdate">Birthdate</label>
|
|
<input class="form-control" id="birthdate" name="birthdate" required type="date">
|
|
{{ form_field_validation(FORM_ERRORS['REQUIRED']) }}
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" for="phonenumber">Phone number</label>
|
|
<input class="form-control" id="phonenumber" name="phonenumber" pattern="(\+\d{1,3}){0,1}[0-9]{7,255}" placeholder="Enter your phone number" required type="tel">
|
|
{{ form_field_validation(FORM_ERRORS['REQUIRED'] + " " + FORM_ERRORS['PHONE_NUMBER_FORMAT']) }}
|
|
</div>
|
|
<div class="col-12">
|
|
<label class="form-label" for="email">Email</label>
|
|
<input class="form-control" id="email" maxlength="255" name="email" placeholder="Enter your email address" pattern="[A-Za-z0-9._%+\-]+@[A-Za-z0-9.\-]+\.[A-Za-z]{2,}$" required >
|
|
{{ form_field_validation(FORM_ERRORS['REQUIRED'] + " " + FORM_ERRORS['VALID_EMAIL']) }}
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" for="password">Password</label>
|
|
<input
|
|
class="form-control"
|
|
id="password"
|
|
maxlength="255"
|
|
minlength="6"
|
|
name="password"
|
|
placeholder="Enter password"
|
|
required
|
|
type="password"
|
|
>
|
|
{{ form_field_validation(FORM_ERRORS['REQUIRED'] + " " + FORM_ERRORS['PASSWORD_LENGTH']) }}
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" for="password-confirmation">Repeat password</label>
|
|
<input
|
|
class="form-control"
|
|
id="password-confirmation"
|
|
maxlength="255"
|
|
minlength="6"
|
|
name="password_confirmation"
|
|
placeholder="Repeat password"
|
|
required
|
|
type="password"
|
|
>
|
|
{{ form_field_validation(FORM_ERRORS['REQUIRED'] + " " + FORM_ERRORS['PASSWORD_LENGTH'] + " " + FORM_ERRORS['MUST_MATCH_PASSWORD']) }}
|
|
</div>
|
|
<div class="col-12">
|
|
<label class="form-label" for="address">Address</label>
|
|
<input class="form-control" id="address" maxlength="255" name="address" placeholder="1234 Main St" required type="text">
|
|
{{ form_field_validation(FORM_ERRORS['REQUIRED']) }}
|
|
</div>
|
|
<div class="col-12 text-center">
|
|
{{ form_submit_button("Register") }}
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<script src="{{ url_for('static', filename='js/validate-form.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/passwords-match.js') }}"></script>
|
|
{% endblock %} |