{% extends "base.html" %}
{% block content %}
{% style """/css/mystyles.css" %}


<div style="padding:15px;">
    <form method="post" action="customer" class="settings">
        {% csrf-field %}
        <label for="customerId">Customer ID</label>
        <input type="text" id="customerId" name="customerId" value="">
        {% if errors.colour %}
        <span class="errors">
                {{errors.customerId|join}}
            </span>
        {% endif %}

        <label for="colour">Colour</label>
        <input type="text" id="colour" name="colour" value="">
        {% if errors.colour %}
            <span class="errors">
                {{errors.colour|join}}
            </span>
        {% endif %}

        <label for="sizes">Size</label>
        <select id="sizes" name="sizes">
            <option value="s">Small</option>
            <option value="m">Medium</option>
            <option value="l">Large</option>
            <option value="xl">Extra Large</option>
        </select>
        {% if errors.sizes %}
        <span class="errors">
                {{errors.sizes|join}}
            </span>
        {% endif %}

        <label for="gender">Gender</label>
        <select id="gender" name="gender">
            <option value="male">Male</option>
            <option value="female">Female</option>
        </select>
        {% if errors.gender %}
        <span class="errors">
                {{errors.gender|join}}
            </span>
        {% endif %}

        <label for="material">Material</label>
        <input type="text" id="material" name="material" value="">
        {% if errors.material %}
        <span class="errors">
                {{errors.material|join}}
            </span>
        {% endif %}

        <label for="quality">Quality</label>
        <select id="quality" name="quality">
            <option value="Standard">Standard</option>
            <option value="Supreme">Supreme</option>
        </select>

        {% if errors.quality %}
        <span class="errors">
                {{errors.quality|join}}
            </span>
        {% endif %}

        <label for="design">Design</label>
        <input type="text" id="design" name="design" value="">
        {% if errors.design %}
        <span class="errors">
                {{errors.design|join}}
            </span>
        {% endif %}

        <label for="quantity">Quantity</label>
        <input type="text" id="quantity" name="quantity" value="">
        {% if errors.quantity %}
        <span class="errors">
                {{errors.quantity|join}}
            </span>
        {% endif %}

        <label for="price">Price</label>
        <input type="text" id="price" name="price" value="">
        {% if errors.price %}
        <span class="errors">
                {{errors.price|join}}
            </span>
        {% endif %}

        <label for="address">Address</label>
        <input type="text" id="address" name="address" value="">
        {% if errors.address %}
        <span class="errors">
                {{errors.address|join}}
            </span>
        {% endif %}

        <input type="submit" onclick=pay() value="Pay">
    </form>
</div>

<script>
    function pay() {
        document.getElementById('somethinghere').value = val;
    }
</script>

{% endblock %}