有没有办法从表单中提交几个类似输入作为列表?

时间:2011-02-25 19:44:05

标签: jquery python ajax json forms

我有一个表单,其中包含10个用于名字的文本输入字段,以及10个用于姓氏的文本输入字段。只需要第一个,所以我期望来自名字和姓氏字段的1-10个变量。

现在我从查询字符串中取出所有20个并忽略空字符串。

问题:有没有办法可以将这些作为JSON字符串传递给服务器,然后在服务器端迭代它们?

我在Google App Engine服务器上使用Django模板,jQuery(在ajax中进行POST)和Python。

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 ...

2 个答案:

答案 0 :(得分:0)

您可能需要查看jQuery serialize()方法。它将为您完成所有工作,并将所有表单值发送到您可以迭代它们的服务器。因此,您可以将代码更改为:

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

答案 1 :(得分:0)

您应该使用serialize()。尝试:

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

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