JQuery и получение 1 одно скрытое значение среди многих форм

Question

У меня есть несколько форм, например:

<form method="post" action="change.php" id="form1">
   <input name="product_id" type="hidden" value="abc" />
   <input name="button_name" id="submit1" type="submit" value="ADD" />
</form>

<form method="post" action="change.php" id="form2>
   <input name="product_id" type="hidden" value="xyz" />
   <input name="button_name" id="submit2" type="submit" value="ADD" />
</form>

и т. Д.

Когда у меня есть одна форма, я знаю, как получить только одно значение, но как я могу получить скрытое значение, соответствующеенажать кнопку?Например, чтобы при нажатии на кнопку form2 я получил «xyz»?

Или было бы лучше иметь большую большую форму, охватывающую всю мою страницу, и прикрепить скрытые значения к самой кнопке?(У меня есть только одно значение, которое мне нужно передать в change.php)

Answer 1

Следующий код присоединяет обработчик к всем формам, но получает значение скрытого поля в любой форме, связанной с текущим событием отправки:

$("form").submit(function() {
   var $product_id = $(this).find('input[name="product_id"]');
   alert("Value within form " + this.id + ": " +$product_id.val());
});

Демо: http://jsfiddle.net/jB88N/

Очевидно, вы бы сделали что-то более полезное, чем просто оповещение о значении, но выше показано, как его получить.В обработчике this - это отправляемая форма.

Answer 2

Вы можете просто сделать один обработчик событий для всех ваших форм.

$('form[id^="form"]').on('submit', function() {
  var hiddenValue = $('input[name="product_id"]', this).val();
});

Но было бы лучше просто использовать AJAX.