jQuery의 직렬화 양식 필드를 사용하고 필드의 값을 다듬는 방법이 있습니까?

Question

jQuery를 사용하여 Ajax 게시물을 제출하고 전송 된 양식을 연속화하는 양식이 있습니다. 코드는 다음과 같습니다.

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

여기서 문제는 필드에 후행 공백이있는 경우 직렬화 기능이 해당 공간을+) 표시로 바꾸어야한다는 것입니다.

필드를 다듬을 수있는 방법이 있습니까? 없이 다음을 수행 :

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

Answer 1

물체를 통해 반복하고 모든 것을 다듬을 수 있습니다.

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

모두 다듬습니다 u003Cinput> 그리고 u003Ctextarea>u003C/textarea> DOM의 요소 값 :

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

Answer 3

제출하기 전에 모든 입력을 고치고 트림을 트림 할 수 있습니다.

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

Answer 4

조금 늦었지만 이것은 아마도 당신이 원하는 것일 것입니다.

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

Answer 5

해당 솔루션 중 어느 것도 실제로 페이지의 양식 필드를 변경하기 때문에 작동하지 않습니다. 사용자가 입력 한 내용을 변경하지 않고 필드의 값을 수정하고 싶습니다.

Answer 6

당신이 할 수있는 한 가지는 숨겨진 값을 가진 별도의 형태를 가지고 있으며, 사용자가 제출할 때 숨겨진 값에 실제 트림 된 양식 값을 저장 한 다음 "숨겨진"양식을 직렬화하고 게시 할 수 있습니다. 그냥 아이디어.

Answer 7

페이지 당 하나의 양식 만 가질 수있는 ASP.NET을 사용하는 경우 다음과 같이 주어진 DIV의 값만 제출할 수 있습니다.

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

그런 다음 업데이트를 다음과 같이 게시하십시오.

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

도우미 기능

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