Элемент формы, добавленный с помощью jQuery, не отправляется в POST

У меня есть zend_form, где я разрешаю пользователю динамически добавлять элементы формы. Элементы добавляются динамически с помощью jQuery: что-то вроде...

$(function(){
  $('#more_answers').click(function(){
    var elemNum = $('.dummy-element').size();

    $("<dd class='dummy-element' id='dummyanswer_"+elemNum+"-element'><input type='text' value='' id='dummyanswer_"+elemNum+"' name='dummyanswer_"+elemNum+"'></dd>").insertBefore('#more_answers-element');

    return false;
  });
});

Элемент добавлен правильно - в пределах тегов. Когда я отправляю, добавленный элемент не отправляется. Я проверил в представлении Net в firebug, и переменная действительно вообще не передается.

В чем может быть проблема? Будет ли это иметь какое-либо отношение конкретно к zend_form? Раньше я добавлял элементы в Zend_Forms, используя необработанный JavaScript, и все работало нормально.

Есть предположения?

Спасибо, я действительно ценю это!

Дополнительная разметка для элементов формы по запросу:

<dd class="dummy-element" id="dummyanswer_2-element">
  <input type="text" value="" id="dummyanswer_2" name="dummyanswer_2">
</dd> <!-- this element was NOT added using jquery -->
<dd id="dummyanswer_3-element" class="dummy-element">
  <input type="text" name="dummyanswer_3" id="dummyanswer_3" value="">
</dd> <!-- this element was added using jquery -->
<dd id="more_answers-element">
  <input width="170px" height="30px" type="image" style="" class="addDummyAnswer" src="/images/add_more_dummy_answers_button_370X60px.png" id="more_answers" name="more_answers">
</dd>

person Mallika Iyer    schedule 20.07.2010    source источник
comment
Можете ли вы опубликовать разметку для #more_answers-element и окружающих элементов?   -  person Nick Craver    schedule 21.07.2010
comment
да добавлю в пост   -  person Mallika Iyer    schedule 21.07.2010
comment
Вы уверены, что место, куда вы добавляете элементы <input>, действительно находится внутри тега <form>?   -  person Pointy    schedule 21.07.2010
comment
Да, это. по крайней мере, это то, что я вижу, когда я делаю исходный код в firefox   -  person Mallika Iyer    schedule 21.07.2010


Ответы (3)


У меня была похожая проблема однажды. Если форма находится внутри таблицы, добавленный элемент (ввод) будет дочерним элементом ячейки таблицы, а не дочерним элементом формы, и не будет «связан» с формой как одно из полей формы, даже если теги таблицы находятся внутри тегов формы.

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

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

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

person flpmor    schedule 20.07.2010
comment
Привет. Поскольку это форма Zend, по умолчанию все находится в наборах полей, у меня также есть ‹div› внутри формы, хотя таблиц нигде нет. Почему-то кажется нелогичным, чтобы «форма» не распознавала элемент, находящийся внутри тегов формы. - person Mallika Iyer; 21.07.2010
comment
Я думаю, что проблема была связана не столько с таблицей, сколько с тем, что между самой формой и добавленным полем ввода были узлы. По крайней мере, в моем случае. - person flpmor; 21.07.2010
comment
в моем случае проблема заключалась в том, что я отображал форму в таблице без тегов tr/td - person Mallika Iyer; 21.07.2010
comment
Если форма находится внутри таблицы, .... Я совершенно забыл об этом ... Я потратил на это 30 минут, спасибо +1 (никакой связи с Zend) - person Dr Casper Black; 11.11.2011

Хорошо, решено - я смотрел исходный код в firefox, и все действительно отображалось правильно. Однако я открыл то же самое в веб-разработчике, и тег формы был скрыт. это выглядело примерно так:

             <dl class = "zend_form">
                    <!---- all the elements -->
             </dl>
          <table>
               <form....></form> <!-- everything hidden -->   
         </table>

я удалил тег таблицы, и он отформатировался нормально. в данном случае, я полагаю, это произошло из-за того, что у меня не было ‹ tr > внутри тега таблицы, поэтому ‹ dl > отображался вне таблицы, а форма отображалась внутри таблицы. Однако все еще возникает вопрос - почему он правильно отображается в «Просмотр исходного кода»?

person Mallika Iyer    schedule 20.07.2010

Я попал сюда, когда искал в StackOverflow аналогичный случай, который, возможно, был закодирован слишком давно. Таким образом, проблема, вероятно, заключается в неправильном формате HTML, кто-то поместил тег «form» в тег «table», из-за чего я не могу получить динамически добавляемые элементы DOM. Как только я реверсирую его, он работает нормально. Так что просто добавьте мои 2 цента здесь.

person simonxy    schedule 21.03.2013
comment
Какова логика 2 центов? - person Vishal Kumar Sahu; 24.05.2017