代码之家 › 专栏 › 技术社区 › Bastian

如何在JavaScript中获取serialize()后的值[重复]

javascript

-1

Bastian · 技术社区 · 3 年前

目前我有以下内容:

$.ajax({
    type: 'POST',
    url: this.action,
    data: $(this).serialize(),
});

这很好,但我想给数据添加一个值,所以我尝试了

$.ajax({
    type: 'POST',
    url: this.action,
    data: $(this).serialize() + '&=NonFormValue' + NonFormValue,
});

但这并没有正确发布。关于如何将项添加到序列化字符串,有什么想法吗?这是一个不特定于表单的全局页面变量。

0 回复 | 直到 11 年前

227

Daisy Leigh Brenecki 11 年前

虽然matt b的答案有效,但您也可以使用 .serializeArray() 要从表单数据中获取数组,请对其进行修改,然后使用 jQuery.param() 将其转换为url编码的表单。这样,jQuery就可以为您处理额外数据的序列化。

var data = $(this).serializeArray(); // convert form to array
data.push({name: "NonFormValue", value: NonFormValue});
$.ajax({
    type: 'POST',
    url: this.action,
    data: $.param(data),
});

124

matt b 13 年前

而不是

 data: $(this).serialize() + '&=NonFormValue' + NonFormValue,

你可能想要

 data: $(this).serialize() + '&NonFormValue=' + NonFormValue,

您应该小心对的值进行URL编码 NonFormValue 如果它可能包含任何特殊字符。

Jonathan 9 年前

别忘了你总能做到:

<input type="hidden" name="NonFormName" value="NonFormValue" />

以实际形式显示,根据具体情况,这可能对代码更有利。

Nikhil Bhandari 11 年前

首先不应该

data: $(this).serialize() + '&=NonFormValue' + NonFormValue,

是

data: $(this).serialize() + '&NonFormValue=' + NonFormValue,

其次,你可以使用

url: this.action + '?NonFormValue=' + NonFormValue,

或者如果操作已经包含任何参数

url: this.action + '&NonFormValue=' + NonFormValue,

Mrchief 13 年前

先添加项,然后序列化:

$.ajax({
    type: 'POST',
    url: this.action,
    data: $.extend($(this), {'NonFormValue': NonFormValue}).serialize()
});

Pratik Gadoya zerkotin 7 年前

我们可以这样做:

data = $form.serialize() + "&foo=bar";

例如

var userData = localStorage.getItem("userFormSerializeData");
var userId = localStorage.getItem("userId");

$.ajax({
    type: "POST",
    url: postUrl,
    data: $(form).serialize() + "&" + userData + "&userId=" + userId,
    dataType: 'json',
    success: function (response) {
        //do something
    }
});

eugene 5 年前

这样更好:

data: [$(this).serialize(),$.param({NonFormValue: NonFormValue})].join('&')

Jithin Vijayan 7 年前

您可以编写一个额外的函数来处理表单数据,并且应该将非表单数据添加为表单中的数据值。例如:

<form method="POST" id="add-form">
    <div class="form-group required ">
        <label for="key">Enter key</label>
        <input type="text" name="key" id="key"  data-nonformdata="hai"/>
    </div>
    <div class="form-group required ">
        <label for="name">Ente Name</label>
        <input type="text" name="name" id="name"  data-nonformdata="hello"/>
    </div>
    <input type="submit" id="add-formdata-btn" value="submit">
</form>

然后添加此jquery以进行表单处理

<script>
$(document).onready(function(){
    $('#add-form').submit(function(event){
        event.preventDefault();
        var formData = $("form").serializeArray();
        formData = processFormData(formData);
        // write further code here---->
    });
});
processFormData(formData)
{
    var data = formData;
    data.forEach(function(object){
        $('#add-form input').each(function(){
            if(this.name == object.name){
                var nonformData = $(this).data("nonformdata");
                formData.push({name:this.name,value:nonformData});
            }
        });
    });
    return formData;
}