$ (this) .serialize () - Comment ajouter une valeur?

actuellement j'ai ce qui suit:

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

Cela fonctionne bien, mais j'aimerais ajouter une valeur aux données, j'ai donc essayé

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

Mais cela n'a pas été publié correctement. Des idées sur la façon dont vous pouvez ajouter un élément à la chaîne de sérialisation? Il s'agit d'une variable de page globale qui n'est pas spécifique au formulaire.

Au lieu de

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

tu veux probablement

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

Vous devez faire attention à encoder en URL la valeur de NonFormValuesi elle peut contenir des caractères spéciaux.

Bien que la réponse de matt b fonctionne, vous pouvez également utiliser .serializeArray()pour obtenir un tableau à partir des données du formulaire, le modifier et l'utiliser jQuery.param()pour le convertir en un formulaire encodé en URL. De cette façon, jQuery gère la sérialisation de vos données supplémentaires pour vous.

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

d'abord ne devrait pas

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

être

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

et deuxièmement, vous pouvez utiliser

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

ou si l'action contient déjà des paramètres

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

Ajoutez d'abord l'élément, puis sérialisez:

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

N'oubliez pas que vous pouvez toujours faire:

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

dans votre forme actuelle, ce qui peut être meilleur pour votre code selon le cas.

On peut faire comme:

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

Par exemple:

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
    }
});

Vous pouvez écrire une fonction supplémentaire pour traiter les données du formulaire et vous devez ajouter vos données non formelles en tant que valeur de données dans le formulaire.Voir l'exemple:

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

Ajoutez ensuite cette jquery pour le traitement du formulaire

<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;
}

c'est mieux:

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