Existe-t-il un moyen d'utiliser les champs de formulaire serialize de jQuery et d'ajuster la valeur dans les champs?

Question

J'ai un formulaire qui utilise jQuery pour soumettre un post ajax et il sérialise le formulaire qui est envoyé. Le code ressemble à ceci:

var form = $("form"); 
var action = form.attr("action"); 
var serializedForm = form.serialize(); 
$.post(action, serializedForm, function(data) 
{ 
    ... 
}); 

Le problème ici est que si un champ a chaque espace final, la fonction serialize tournera ces espaces pour plus (+) signe, quand ils devraient être dépouillés.

Y at-il un moyen d'obtenir les champs parés sans faire ce qui suit:

$("#name").val(jQuery.trim($("#name"))); 

Answer 1

Vous pourriez essayer de faire défiler l'objet et tout rogner.

//Serialize form as array 
var serializedForm = form.serializeArray(); 
//trim values 
for(var i =0, len = serializedForm.length;i<len;i++){ 
    serializedForm[i] = $.trim(serializedForm[i]); 
} 
//turn it into a string if you wish 
serializedForm = $.param(serializedForm); 

Answer 2

toutes les garnitures < entrée > et <textarea> </textarea > valeurs d'éléments dans les DOM:

$('input, textarea').each(function(){ 
    $(this).val(jQuery.trim($(this).val())); 
}); 

Answer 3

Vous pouvez boucler toutes les entrées et rogner avant de les soumettre.

$("input, textarea").each(function(){ 
    $(this).val(jQuery.trim($(this).val())); 
}); 

Answer 4

Aucune de ces solutions ne fonctionne, car elles modifient réellement les champs de formulaire sur la page. Je veux juste modifier la valeur du champ qui, sans changer ce que l'utilisateur a tapé.

Answer 5

Une chose que vous pouvez faire est d'avoir une forme séparée avec des valeurs cachées, et stocker le réel, garni, les valeurs se forment dans les valeurs cachées lorsque l'utilisateur soumet, alors vous pouvez sérialiser la forme « cachée » et post cette. Juste une idée.

Answer 6

Si vous utilisez ASP.NET où vous pouvez avoir une seule forme par page, vous pouvez soumettre uniquement les valeurs d'une DIV donnée comme suit:

var dataString = "source=contactDiv"; 
dataString += getDataString(divId, "input"); // add inputs 
dataString += getDataString(divId, "select"); //add select elements 

puis après la mise à jour comme suit:

$.post("UpdateContact.aspx", 
     dataString, 
     afterUpdate, 
     "json"); 

fonctions d'aide

function afterUpdate(data){ 
//add some post-update info 
} 

function getDataString(divId, tagName) { 
    var data = ""; 
    var elements = $("#" + divId + " " + tagName); 
    for (var i = 0; i < elements.length; i++) { 
     var el = elements[i]; 
     var name = el.name; 
     var value = $(el).val(); 
     if (value != null && value != "undefined") 
      value = $.trim(value + ""); //added "" to fix IE 6 bug for empty select  
     if (el.type == "checkbox") 
      value = el.checked; 
     else if (el.type == "radio" && !el.checked) 
      value = ""; 
     if (!(value == "" || value == "undefined" || name == "" || name == "undefined")) 
      data += "&" + name + "=" + escape(value); 
    } 

    return data; 
} 

Answer 7

Un peu en retard, mais cela était probablement ce que vous vouliez:

var form = $("form"); 
var action = form.attr("action"); 
var formArr = form. serializeArray(); 
jQuery.each(formArr , function(i, field) { 
    formArr[i].value = $.trim(field.value); 
}); 
var serializedForm = $.param(formArr); 
$.post(action, serializedForm, function(data) 
{ 
    ... 
});