Как получить данные из формы по нажатой input с типом button?

Question

Есть форма, в которой 5 инпутов с типом кнопок. При отправке формы нужно получить, какую из кнопок нажал пользователь. БЕЗ JavaScript! Получать данные нужно в переменную product_size, которая находится в функции proof_success(product_id)

HTML

<form method="post" action="proof/success">
    <div class="assorti"><h2>{{ product.product }}</h2></div>
    <div class="cardcontainer">
        <article class="card">
            <img src="{{ url_for('static', filename='img/t-shirts.jpg') }}" alt="Футболка" height="270">
        </article>
    </div>
    <div class="oryr">
        <h3>{{ product.product_price }} руб</h3>
            
        <div class="choose_size">
            <input name="XS" type="button" value="XS" class="cs_card">
            <input name="S" type="button" value="S" class="cs_card">
            <input name="M" type="button" value="M" class="cs_card">
            <input name="L" type="button" value="L" class="cs_card">
            <input name="XL" type="button" value="XL" class="cs_card">
        </div>

        <ul>
            <p>Собственное произодство</p>
            <p>Хлопок - 100%</p>
            <p>Качественный принт</p>
        </ul>
    </div>

    <div class="box_4_btn">
        <button data-v-c3114ba2="" class="app-button basket-price__submit width-100 paypose" type="submit">
        Добавить в корзину</button>
    </div>
</form>

PYTHON

@app.route('/<int:product_id>/proof/success', methods=["GET", "POST"])
def proof_success(product_id):
    product = Cart.query.get_or_404(product_id)

    product_price = product.product_price

    if request.method == "POST":
        pass

        return redirect(url_for('tshirts'))

Answer 1

input[type=button] не триггерит событие form.submit

Вы можете заменить на следующий код, и поправить css, что слетит.

 <button name="XS" type="submit" value="XS" class="cs_card">

Или таки добавить событие onclick="form.submit()" к каждому input

[оффтоп] Почему нельзя использовать js? [/оффтоп]

Answer 2

Как уже сказал(а) @Rijen, обычный button не будет вызывать событие submit, которое делает отправку самой формы. Для отправки данных без submit, можете использовать jQuery.ajax или fetch, но тогда уже сам тег form не будет вам нужен. Почему?

Когда вы делаете форму, вы задаёте ей некоторые поля для ввода со специальными аттрибутами, с помощью которых вы настраиваете отправку этой же формы на сервер, связываете данные и т.д. Данные из этой формы будут отправлены на сервер с использованием button type submit. Отправка через jQuery.ajax или fetch позволяет отправлять любые данные без обязательности использования самой формы.

Второе, я не очень могу понять, почему у вас вас вопрос называется "Как получить данные из формы по нажатой input с типом button?", но в самом вопросе это никак не описывается? Почему нельзя использовать js? А ещё у вас нет переменной product_size в коде.

Соответственно, поставленная вами задача является невыполнимой

БЛОГ НА HUSL

Как получить данные из формы по нажатой input с типом button?

Ответы (2 шт):