Question

我有一个相当简单的表单，包含一些复选框，单选按钮和选择框。我想使用jQuery＆＃39; $ .ajax发布所有选定的表单数据。但由于某种原因，表格并没有被序列化。我不确定导致这种情况的原因......（旁注：$('#FormID').submit(..)对我不起作用）。所以我创建了一个包含以下代码的按钮：

$(document).ready(function() {
    $('#DoSearchRequest').click(function(event) {
        //event.preventDefault(); // read about this somewhere, doesn't help
        $('#res').html($('#FormSearch').serialize()); // just some <p> to output the result to
        $.ajax({
            url:        'http://www.domain.nl/ajax/GetResultsBySearchRequest.php',
            data:       $('#FormSearch').serialize(),
            type:       'POST',
            success:    function(result) {
                            console.log(result);
                        },
            error: function(a, b, c) { console.log(a); }

        });

        return false;
    });
});

我的按钮位于表单之外（如果表单形式也没关系。）

我的表格：

<form name="FormSearch" id="FormSearch" method="post">
... form elements
</form>

我正在使用jQuery 1.7.1和jQueryUI 1.8.18

Answer 1

愚蠢但对我而言，我没有在表单中为字段命名，因此.serialize给了我一个空字符串，.serializeArray也没有用。

命名您的表单字段，或者您不会获得任何值。

<input name='importantField'/>

与

不同

<input id='importantField'/>

如果您尚未在表单字段中定义任何名称，则

.serialize或.serializeArray甚至默认表单提交仍然有效。

Answer 2

在查看预览网页后，我说问题可能是你有嵌套的表单元素＆＃34; form543＆＃34;在另一个表单元素＆＃34; searchbar＆＃34;。

中

在Firefox中进行测试，我发现$("#form543").length为0，因此jQuery显然无法找到该表单。当我尝试$("#searchbar").serialize()时，它返回了选择元素的实际字段值以及我检查过的复选框等。

我建议删除外部表单元素＆＃34; searchbar＆＃34; （或以其他方式更改标记，以便您没有嵌套表单），看看您的JS代码是否有效。

Answer 3

你必须做出类似的事情：

$('form').submit(function() {
  alert($(this).serialize());
  return false;
});

Answer 4

在所有表单（包括按钮）中为所有输入使用名称属性例如。 <input type="text" id="fname" name="fname"/>

然后您可以测试serial()函数是否起作用：

$('#contact-form').submit(function() {
  alert($(this).serialize());
});

然后在Ajax中使用

：

  $.ajax({
    type: 'POST',
    url: 'SendAd.php',
    dataType: 'json',
    data: $('#contact_form').serialize(),
})

jQuery的.serialize（）没有做任何事情

4 个答案: