Есть ли способ отправить несколько одинаковых входных данных в виде списка из формы?

Question

У меня есть форма, которая имеет 10 полей ввода текста для имен и 10 полей ввода текста для фамилий.Требуется только первое, поэтому я ожидаю 1-10 переменных из полей имени и фамилии.

Сейчас я вытаскиваю все 20 из строки запроса и игнорирую пустые.

ВОПРОС: есть ли способ передать их на сервер в виде строки JSON, а затем перебрать их на стороне сервера?

Я использую шаблоны Django, jQuery (POSTing в ajax) и Python на сервере Google App Engine.

HTML:

<label>First Name</label>
<input type="text" name="fname-1" id="fname-1" /><br/>
<label>Last Name</label>
<input type="text" name="lname-1" id="lname-1" /><br/>

<label>First Name</label>
<input type="text" name="fname-2" id="fname-2" /><br/>
<label>Last Name</label>
<input type="text" name="lname-2" id="lname-2" /><br/>

<label>First Name</label>
<input type="text" name="fname-3" id="fname-3" /><br/>
<label>Last Name</label>
<input type="text" name="lname-3" id="lname-3" /><br/>
....

jQuery:

var fname_1 = $("input#fname-1").val();
var fname_2 = $("input#fname-2").val();
var fname_3 = $("input#fname-3").val();
var fname_4 = $("input#fname-4").val();
var lname_1 = $("input#lname-1").val();
var lname_2 = $("input#lname-2").val();
var lname_3 = $("input#lname-3").val();
var lname_4 = $("input#lname-4").val();
....

    $.ajax({  
        type: "POST",  
        url: "/foo/",  
        data: {"fname_1":fname_1,"fname_2":fname_2,
                   "fname_3":fname_3,"fname_4":fname_4,
                   "lname_1":lname_1,"lname_2":lname_2,
                   "lname_3":lname_3,"lname_4":lname_4},  
        dataType: "json",
    ...

Py:

fname_1 = self.request.get('fname_1')
fname_2 = self.request.get('fname_2')
fname_2 = self.request.get('fname_3')
fname_2 = self.request.get('fname_4')
lname_1 = self.request.get('lname_1')
lname_2 = self.request.get('lname_2')
lname_2 = self.request.get('lname_3')
lname_2 = self.request.get('lname_4')

#do stuff, check for missing properties, create new Object with data ...

Answer 1

Вы должны использовать serialize().Попробуйте:

var myData = $("#formId").serialize();

$.ajax({  
    type: "POST",  
    url: "/foo/",  
    data: myData,  
    dataType: "json",
...

Answer 2

Возможно, вы захотите взглянуть на метод jQuery serialize().Он выполнит всю работу за вас и отправит все значения форм на сервер, где вы сможете их перебирать.Таким образом, вы можете изменить свой код на:

var data = $("form").serialize();
$.ajax({  
    type: "POST",  
    url: "/foo/",  
    data: data,  
    dataType: "json",