74 lines
2.2 KiB
HTML
74 lines
2.2 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% load static %}
|
|
|
|
{% block title %}Winkel{% endblock %}
|
|
|
|
{% block content %}
|
|
<script>
|
|
let sum_33 = 0
|
|
let sum_55 = 0
|
|
let total_sum = 0
|
|
|
|
function input_changed() {
|
|
sum_33 = Number(document.getElementById(`amount_33`).value) * 25;
|
|
sum_50 = Number(document.getElementById(`amount_50`).value) * 30;
|
|
|
|
let total_field_33 = document.getElementById(`sum_33`);
|
|
total_field_33.innerText = sum_33;
|
|
let total_field_50 = document.getElementById(`sum_50`);
|
|
total_field_50.innerText = sum_50;
|
|
|
|
|
|
let total_sum = document.getElementById(`total_sum`);
|
|
total_sum.innerText = sum_33 + sum_50;
|
|
}
|
|
</script>
|
|
|
|
<form class="cart" action="{% url 'winkel' %}" method='post'>
|
|
{% csrf_token %}
|
|
<div class="leftcell buy_button_cell">
|
|
<button class="buy_button" style="font-size:95%">Bestel</button>
|
|
</div>
|
|
<div class="total_quantity">
|
|
</div>
|
|
<div class="rightcell total_price">
|
|
<span class="bold equals">=</span><span> €</span>
|
|
<span id="total_sum">0</span>
|
|
</div>
|
|
|
|
|
|
<div class="leftcell"><img class="photo" src="{% static 'mate33.jpg' %}"></div>
|
|
<div class="midcell">
|
|
<span class="quantity">
|
|
<input id="amount_33" name="amount_33" type="number" value="0" placeholder="0" onfocus="this.placeholder=''"
|
|
onblur="this.placeholder='0'" oninput="input_changed()">
|
|
</span>
|
|
<span>x</span>
|
|
<span class="unit_price">€25</span>
|
|
</div>
|
|
<div class="rightcell price">
|
|
<span class="bold equals">=</span>€
|
|
<span id="sum_33">0</span>
|
|
</div>
|
|
|
|
|
|
<div class="leftcell"><img class="photo" src="{% static 'mate50.jpeg' %}"></div>
|
|
<div class="midcell">
|
|
<span class="quantity">
|
|
<input id="amount_50" name="amount_50" type="number" value="0" placeholder="0" onfocus="this.placeholder=''"
|
|
onblur="this.placeholder='0'" oninput="input_changed()">
|
|
</span>
|
|
<span>x</span>
|
|
<span class="unit_price">€30</span>
|
|
</div>
|
|
<div class="rightcell price">
|
|
<span class="bold equals">=</span>€
|
|
<span id="sum_50">0</span>
|
|
</div>
|
|
</form>
|
|
<div>
|
|
<p>Bakken met telkens 20 flesjes</p>
|
|
</div>
|
|
{% endblock %}
|