Как заставить Jquery обрабатывать все формы?

Question

[siyai]

При написании каталога я захотел использовать асинхронный JS, что бы страница не обновлялась при каждом выполнении скрипта. Добавление в корзину является формой, которая получает айди товара. Проблема заключается в том, что Jquery обрабатывает только первую форму и даже если я добавляю в корзину 3й товар, то добавляется первый. Помогите решить проблему

<script>
        $(document).ready(function () {
            $("form").on('submit', function (event) {
                event.preventDefault();
                $.post("vendor/form.php", { request: $('#request').val(), id_user: $('#id_user').val() });
            });
        });
    </script>

<form method="post">
            <input id="request" name="request" value="20 товар">
            <input id="id_user" type="hidden" name="id_user" value="  <? echo $_SESSION['user']['id']; ?>">
            <input type="submit" value="Отправить">
        </form>

        <form method="post">
            <input id="request" name="request" value="100 товар">
            <input id="id_user" type="hidden" name="id_user" value="  <? echo $_SESSION['user']['id']; ?>">
            <input type="submit" value="Отправить">
        </form>
        <form method="post">
            <input id="request" name="request" value="150 товар">
            <input id="id_user" type="hidden" name="id_user" value="  <? echo $_SESSION['user']['id']; ?>">
            <input type="submit" value="Отправить">
        </form>

Comments

[lUser L]

Очень странный код.
как минимум id должен быть уникальным
задай инпуту класс request и id_user вместо id

$.post("vendor/form.php", { request: $(this).find('.request').val(), id_user: $(this).find('.user-id').val() });

[siyai]

lUser L, Спасибо, помогло!