"option", "input" 태그 모두 value 속성을 통해 post 메서드로 데이터를 전달한다.
- 아래 코드에서는 'option'에서 "inventory.id"라는 값을 전달한다.
- input 역시 value를 통해 값을 전달하는데 여기서는 가변적으로 수량을 입력하기 때문에, 하단에서 자바스크립트 코드를 통해 default는 '1'로 두고 입력된 값을 value로 받아 전달하도록 했다.
<form action="{% url 'cart:add_cart' %}" method="POST">
{% csrf_token %}
<div style="display: flex; align-items: center; width:320px; margin-bottom:20px;">
<span style="font-size:16px;color:#555555;">옵션</span>
<select name="inventory" class="form-select" aria-label="Default select example" style="margin-left:20px; width:260px;">
{% for inventory in inventories %}
{% if inventory.stock == 0 %}
<option value="{{inventory.id}}">{{inventory.color}} - {{inventory.size}} (품절)</option>
{% else %}
<option value="{{inventory.id}}">{{inventory.color}} - {{inventory.size}} ({{inventory.stock}}개 남음)</option>
{% endif %}
{% endfor %}
</select>
</div>
<div id="mainDiv" style="display: flex; align-items: center; margin-bottom:25px; margin-top:20px; font-size:16px;color:#555555;">
수량 선택 <input type="number" name="quantity" style="width:70px; margin-left:20px;" min="1" id="numberPlace" class="form-control qty-input text-center">
</div>
<button type="submit" class="btn btn-outline-secondary" style="margin-right:5px;">Add To Cart</button>
</form>
<script>
document.getElementById('numberPlace').value = '1';
</script>
views.py에서 받아오는 데이터는 위 html 태그 내에서 정한 name에 따라 구분한다.
request.POST.get('name')
와 같은 형태로
request.POST.get을 활용해 name에 해당하는 입력 값을 받아온다.
def add_cart(request):
if request.method == 'POST':
current_user = request.user
selected_inventory = request.POST.get('inventory')
selected_quantity = int(request.POST.get('quantity'))
stock_now = Inventory.objects.get(id=selected_inventory).stock
cart = Cart()
cart.user = current_user
cart.inventory = Inventory.objects.get(id=selected_inventory)
cart.quantity = selected_quantity
cart.save()
return redirect('/')