Получите значение полей выбора из нескольких форм.

Question

В принципе, я повторяю эту форму пару раз, каждая со своей собственной кнопкой отправки. В этой ситуации я не могу объединить все поля выбора из форм в одну форму.

<form method="post" action=""> 
    <select name="hour" class="hour"> 
    // option tags 
    </select> 
    <select name="minutes" class="minutes"> 
    // option tags 
    </select> 
<input type="submit" name="submit" class="submit"> 
</form> 

Я использую AJAX для обработки значений te.

$(".submit").click(function() { 
    var hour = $(".hour").val(); 
    var minutes = $(".minutes").val(); 
// AJAX code here 
}); 

Однако переменные «час» и «минуты» будут удерживать только значение поля выбора из первой формы. Как я могу позволить этим переменным иметь правильное значение, если кнопка отправки нажата на вторую, третьей формы?

Answer 1

Вы можете сделать это:

$(".submit").click(function() { 
    var $form = $(this).closest('form'); 
    var hour = $form.find(".hour").val(); 
    var minutes = $form.find(".minutes").val(); 
    // AJAX code here 
}); 

На щелчке кнопки отправки будет идти в ближайший form и найти список выбора в нем и получить значения respectives соответственно. А затем вы можете обрабатывать данные.

Answer 2

Добавить контекст, например:

$(".submit").click(function() { 
    var hour = $(".hour", $(this).parent()).val(); 
    var minutes = $(".minutes", $(this).parent()).val(); 
// AJAX code here 
}); 

EDIT: Этот код предназначен только для вашего примера. Если структура DOM может отличаться, это может потребоваться.

Также вы можете использовать событие «отправить» для формы вместо «нажмите». В этом случае вы можете использовать $(this) в качестве контекста.