Несколько форм на странице - значение текстовой области распознается только в первой с использованием jQuery

Question

У меня есть цикл, который создает небольшое количество форм на странице.Вот как выглядит создание цикла в PHP.Этот код находится внутри цикла:

echo '<form class="add_suggested_solution_comment"  method="post">';
echo '<p><textarea class="suggested_solution_comment" cols=65 rows=6 ></textarea></p>';
echo '<input type="hidden" class="problem_id" value="'.$problem_id.'" />';                                                  echo '<input type="hidden" class="suggestion_id" value="'.$suggestion_id.'" />';   
echo '<input type="hidden" class="solution_section_id" value="'.$solution_section_id.'" />'; 
echo '<p><input type="submit" class="button" value="Add Comment"></input></p>';             
echo '</form>';

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

$('.add_suggested_solution_comment').live('submit',function()
{   
    var problem_id = $('.problem_id').val();
    var comment = $(".suggested_solution_comment").val();   
    var solution_id = $('.suggestion_id').val();    
    var solution_section_id = $('.solution_section_id').val();      
        ...

И проблема в том, что если текствводится в первую текстовую область, она распознается строкой, которая получает комментарий: var comment = $ (". Sugges_solution_comment"). val ();

Но если введены какие-либо другие поля текстовой области, их значения не распознаются этой строкой.

Есть идеи, что я делаю неправильно?

Спасибо!

Answer 1

Используйте аргумент контекста jQuery, например:

$('.add_suggested_solution_comment').live('submit',function()
{   
    var $this = $(this);
    var problem_id = $('.problem_id', $this).val();
    var comment = $(".suggested_solution_comment", $this).val();   
    var solution_id = $('.suggestion_id', $this).val();    
    var solution_section_id = $('.solution_section_id', $this).val();      
    ...

При этом будут выбраны только элементы в текущей отправляемой форме.

Answer 2

Не лучше ли явно указать текстовую область с помощью идентификатора, поскольку у вас есть идентификатор проблемы, который вы можете использовать?В противном случае вы пытаетесь получить один val () из селектора класса с произвольным числом совпадений.

(То же самое относится и к другим полям, которые вы не определяете однозначно.)

Полагаю, вы могли бы найти соответствующего потомка элемента формы, а не весь DOM.

Answer 3

Просто короткая мысль: используйте идентификаторы, чтобы различать входы в циклах.Что-то вроде:

for ($i=0; $i<$something; $i++){
...
   echo '<input type="hidden" class="problem_id" id="problem_id_'.$i.'" value="'.$problem_id.'" />'; 
...
}

, тогда вы сможете получить доступ к этим отдельно и пустым полям на итерации x, не перезаписывая ваши входные данные с начала формы.

Answer 4

... Я бы предложил генерировать texareas с идентификаторами вместо классов и обращаться к ним соответствующим образом с помощью jQuery, чтобы jQ не запутался в том, с какой текстовой областью он имеет дело.