Сериализация формы jQuery - пустая строка

95

Мой html:

 <script type="text/javascript">

    $(function() {

        $("#bt1").click(function() {

            var f = $("#form1");
            var formData = f.serialize();

            alert(formData);
        });

    }); 
</script> 

 <div id="div1">
      <form id="form1" action="/Home/Test1" method="post" name="down">
        <div id="div2">
            <input id="input1" type="text" value="2" />
        </div>    
      </form>
  </div>

 <input type="submit" id="bt1" />

Когда я запускаю событие щелчка, formData пуст. Я использую jQuery 1.4.2.

user137348
источник

Ответы:

214

Вы должны дать inputэлементу имя. Например:

<form id="form1" action="/Home/Test1" method="post" name="down">
    <div id="div2">
        <input id="input1" type="text" value="2" name="foo"/>
    </div>    
</form>

даст вам в окне предупреждения foo=2.

.serialize()берет имя и значение полей формы и создает строку вроде name1=value1&name2=value2. Без имени он не может создать такую ​​строку.

Обратите внимание, что nameэто нечто иное, чем id. Ваша форма также не сработала бы, если бы вы использовали ее "обычным" способом. Каждому полю формы нужно имя.

Феликс Клинг
источник
1
необходимы ли идентификаторы для сериализации формы кстати?
Vic
Позвольте мне предложить сюда также включить ответ Madbreaks.
Slavic
У меня есть имя, но у меня все еще есть пустая строка при сериализации моего представления в виде коллекции, поэтому имена, например, [0] .Unit, [0] .Currency
Марк Руссель
Ответ ниже помог мне ... убедитесь, что ваши входы НЕ ОТКЛЮЧЕНЫ!
звуковая дорожка
83

Хотя это не относится к этому конкретному примеру, такое же поведение происходит, если один или несколько входов формы есть disabled. Эти входные данные не будут отображаться в сериализованной строке. В моем случае все входные данные формы имели значения, но были отключены, в результате чего возвращалась пустая строка.

Madbreaks
источник
4
Это неприятно. Хотел отключить поля, пока отправляю почту в стиле ajax, и сделал это перед сериализацией формы ...
Дэниел Лэнг
1
О, черт возьми, это была проблема, которая сводила меня с ума. +1 человек, как заставить его работать с отключенными элементами?
Noitidart
@Noitidart Вы можете написать собственное serializeрасширение jQuery, которое выполняет итерацию по входам и включает отключенные. Но, насколько мне известно, это невозможно сделать с помощью готового jQuery.
Madbreaks
Имеет смысл не включать отключенные элементы, поскольку отключенные элементы не должны содержать пользовательский ввод.
Дженни О'Рейли
2
@ JennyO'Reilly Конечно, но отсутствие пользовательского ввода не означает, что "не имеет значения".
Madbreaks
10

На nameвходе нет атрибута ... это может быть проблемой для сериализации.

<input id="input1" type="text" value="2" name="input1" />
Виктор
источник
Мужчина. Вы такой спаситель жизни !! Спасибо.
Анджана Сильва
6

Также убедитесь, что на странице нет двух элементов с одинаковым идентификатором.

ВахидН
источник
3
Это комментарий, а не ответ на вопрос. Пожалуйста, используйте комментарии в будущем. Спасибо :)
Gone Coding