使用ajax提交包含未知数量字段的html表单

时间:2012-07-11 21:11:55

标签: javascript jquery html ajax forms

我有一对由文本字段组成的表单。用户可以根据需要创建任意数量的对并填写字段。字段行添加到表格的底部。 以下是格式示例:

<form id="dataForm">
<table id="textTable">
<tbody>
<tr>
  <td><h2>Dancer</h2></td>
  <td><h2>Place</h2></td>
</tr>
<tr>
  <td><input type="text" name="Dancer0" size="15" id="Dancer0"></td>
  <td><input type="text" name="Place0" size="15" id="Place0"></td>
</tr>
<tr>
  <td><input type="text" name="Dancer1" size="15" id="Dancer1"></td>
  <td><input type="text" name="Place1" size="15" id="Place1"></td>
</tr>
</tbody>
</table>
<input type="button" id="newRow" value="New Row" accesskey="/" onclick="moreFields();">
<input type="button" value="Update" name="Submit" onclick="submitForm(this.form);">
</form>

我遇到的麻烦是使用ajax将表单正确提交到外部php页面。这是我现在正在使用的功能:

function submitForm(form)
{
jQuery.ajax({
    type: "POST",
    url: <?php echo '"'.dirname(curPageURL()).'/ResultsUpdater.php"' ?>,
    data: form.serialize(),
    success: function(msg){
        alert(msg);
    }
});
return false;
}

在其他示例中,我看到他们使用$来表示jQuery,它将放在“form”前面:$(form).serialize()$.ajax({...但我的服务器不喜欢{{ 1}}。我也试过$,但这也不起作用。我在控制台中遇到的错误始终与jQuery.form.serialize()

一致

如果我可以向php文件提交一堆键值对(从我理解的序列化()中提取),那就太棒了。

您可以试用here

表单

只需选择其中一个下拉项即可查看表单。

由于

1 个答案:

答案 0 :(得分:3)

你可以这样做:

jQuery("#dataForm").serialize();

我已在您引用的网页上成功尝试过。

由于您的页面上未定义$,我最好的猜测是您加载了一些将$重置为未定义的脚本。最好的方法是回退使用jQuery,因为$只是jQuery的别名。