2

我有一个相当简单的表单,其中包含一些复选框、单选按钮和选择框。我想使用 jQuery 的 $.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

4

4 回答 4

9

愚蠢,但对我来说,我没有在表单中命名字段,所以.serialize给了我一个空字符串,也.serializeArray没有用。

命名您的表单字段,否则您将无法获得任何值。

<input name='importantField'/>

不一样

<input id='importantField'/>

.serialize如果您没有在表单字段上定义任何名称,甚至.serializeArray默认表单提交将不起作用。

于 2015-03-13T10:34:40.437 回答
3

查看您的预览网页后,我会说问题可能是您将表单元素“form543”嵌套在另一个表单元素“搜索栏”中。

在Firefox中测试,我发现jQuery显然$("#form543").length根本0找不到表单。当我尝试$("#searchbar").serialize()它返回选择元素的实际字段值和我检查过的复选框等等。

我建议删除外部表单元素“搜索栏”(或以其他方式更改标记,以便您没有嵌套表单),然后查看您的 JS 代码是否有效。

于 2012-11-01T00:20:16.283 回答
1

你必须做这样的事情:

$('form').submit(function() {
  alert($(this).serialize());
  return false;
});
于 2012-10-31T22:47:17.077 回答
1

对表单中的所有输入(包括按钮)使用名称属性,例如<input type="text" id="fname" name="fname"/>

然后您可以测试该serial()功能是否有效:

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

然后在阿贾克斯:

  $.ajax({
    type: 'POST',
    url: 'SendAd.php',
    dataType: 'json',
    data: $('#contact_form').serialize(),
})
于 2018-08-22T07:22:29.597 回答