양식을 제출하기 전에 양식의 매개 변수에서 빈 값을 삭제하십시오.

Question

양식의 변경 사항을 캐치하는 JavaScript가 있는데 양식의 일반 제출 기능이 호출됩니다. 양식은 GET 양식 (검색 용)이며 많은 빈 특성이 params에 있습니다. 내가 뭘하려는 깨끗한 URL을 얻기 위해 제출하기 전에 빈 속성을 삭제하는 것입니다 : 누군가가 '대상'을 변경하는 경우 예를 들어, '영어'내가 그들의 검색 URL이 원하는에 선택

http://localhost:3000/quizzes?subject=English 

대신에

http://localhost:3000/quizzes?term=&subject=English&topic=&age_group_id=&difficulty_id=&made_by=&order=&style= 

이 현재 그대로입니다. 이것은 순수하고 더 의미있는 URL을 사람들의 북마크 등에 연결하는 목적으로 만 사용됩니다. 그래서 내가 필요한 것은이 라인을 따라 뭔가가 있습니다. 그러나 이것은 실제 양식을 편집하지 않으므로 옳지 않습니다. 그러나 폼의 PARAMS 만든 JS 개체 :

quizSearchForm = jQuery("#searchForm"); 
    formParams = quizSearchForm.serializeArray(); 
    //remove any empty fields from the form params before submitting, for a cleaner url 
    //this won't work as we're not changing the form, just an object made from it. 
    for (i in formParams) { 
    if (formParams[i] === null || formParams[i] === "") { 
     delete formParams[i]; 
    } 
    } 
    //submit the form 

나는 내가 이것에 가까운 것 같아,하지만 난 실제 폼의 속성을 편집하기보다는 다른 개체를 만들고 그 편집 방법의 단계를 누락. 이 해결 - - 편집

최대 - 어떤 조언에 감사

이것에 대해 게시 된 많은 사람들에게 감사합니다. 내가 가진 것은 완벽하게 작동하는 것 같습니다. 양식의 submit 메소드를 호출하는 경우

function submitSearchForm(){ 
    quizSearchForm = jQuery("#searchForm"); 
    //disable empty fields so they don't clutter up the url 
    quizSearchForm.find(':input[value=""]').attr('disabled', true); 
    quizSearchForm.submit(); 
} 

Answer 1

disabled이 true으로 설정된 입력은 양식과 함께 제출되지 않습니다. 그래서 하나 개의 jQuery 라인 : - 그래서 아마 다른 사람이 그 혜택을 누릴 수 있습니다

$(':input[value=""]').attr('disabled', true); 

Answer 2

당신은 그렇게 할 수 없습니다; 그러면 jQuery가 작성한 배열이 아닌 전체 양식이 제출됩니다.

수행 할 수있는 작업은 양식을 제출하기 전에 비어있는 양식 입력란을 사용 중지하는 것입니다. 비활성화 된 입력란은 양식 제출에서 생략됩니다. 양식의 요소를 살펴보고 비어있는 각 요소에 대해 사용하지 않도록 설정 한 다음 양식의 submit 메서드를 호출하십시오. (대상이 다른 창이면 다시 돌아가서 필드를 다시 활성화해야합니다. 대상이 현재 창인 경우 아무래도 페이지가 바뀝니다.)

Answer 3

음

$('#searchForm').find('input, textarea, select').each(function(_, inp) { 
    if ($(inp).val() === '' || $(inp).val() === null) 
    inp.disabled = true; 
    } 
}); 

은 "serializeArray()"루틴의 결과들을 포함되지 않습니다 당신이 할 수있는 한 가지는 "serializeArray"를 호출하기 전에 빈 입력 을 사용하지 않도록하는 것입니다. 양식 게시로 인해 완전히 새로 고침 된 페이지가 생성되지 않으면 되돌아와 다시 사용하도록 설정해야 할 수 있습니다.

Answer 4

$('form#searchForm').submit(function() { 
    $(':input', this).each(function() { 
     this.disabled = !($(this).val()); 
    }); 
}); 

Answer 5

귀하의 문제는 나를 조금 다른 내 상황을 알아낼 수있었습니다. 양식을 직접 제출하는 대신 빈 양식 요소가 ,이 AJAX를 통해 게시 된 일련 화 된 배열로 수집되지 않도록해야했습니다.

내 경우

, 나는 단순히 폼 요소를 통해 루프 필요하고 그래서 같이 배열에 먹다 남은 음식을 수집 한 후 비어 있었다 모든 것을 해제하고 : 난 항상 추천하는 또 다른 방법은하는 것입니다

// Loop through empty fields and disable them to prevent inclusion in array 
$('#OptionB input, select').each(function(){ 
    if($(this).val()==''){ 
     $(this).attr('disabled', true); 
    } 
}); 

// Collect active fields into array to submit 
var updateData = $('#OptionB input, select').serializeArray(); 

Answer 6

을 당신이 할 수있는 서버 측 : 그래서, 제대로 입력 데이터

설정 기본값

변경 입력 값의 경우

1. 검증 N
깨끗한 URL 또는 "/ 퀴즈/영어/레벨 1 /"그렇지 않으면

텍스트 입력, 선택, 라디오 등을 처리해야합니다 ...

으로 친화적 인 URL을 가지고 eeded

Answer 7

제안 된 솔루션 중 일부는 질문이 작성된 시점 (2010 년 3 월)에 수행되었지만 2014 년 8 월 현재 빈 입력을 사용할 수 없게하는 솔루션은 작동하지 않을 수도 있습니다. 사용 중지 된 입력란은 내 Chrome에서도 전송됩니다. 그러나 "name"속성을 삭제하려고 시도했지만 정상적으로 작동했습니다!

$('form').submit(function(){ 
    $(this).find('input[name], select[name]').each(function(){ 
     if (!$(this).val()){ 
      $(this).removeAttr('name'); 
     } 
    }); 
}); 

업데이트 : 나에게 일을하지 않는 필드를 해제하는 것은 뭔가 2010 년 이후로 변경하지만 여전히 내 Google 크롬에서 작동하지 없기 때문에 좋아, 아마 이유. 나도 몰라, 어쩌면 리눅스 버전에있을거야. 어쨌든, attr이라는 이름을 제거하는 것이 정책이 비활성화 된 필드에 대해 브라우저를 사용하는 것에도 불구하고 더 나은 것으로 생각됩니다. 이름 attr이없는 경우 매개 변수를 보낼 방법이 없습니다. 또 다른 장점은 일반적으로 필드를 비활성화하면 일부 스타일이 변경된다는 의미이며, 양식이 최종적으로 제출되기 전에 양식의 스타일이 변경된 것을 보니 좋지 않습니다. remove name attr 솔루션을 토글 할 수 없으므로 Max Williams가 주석에서 언급했듯이 단점도 있습니다.

$('form').submit(function(){ 
    $(this).find('input[name], select[name]').each(function(){ 
     if (!$(this).val()){ 
      $(this).data('name', $(this).attr('name')); 
      $(this).removeAttr('name'); 
     } 
    }); 
}); 

function recoverNames(){ 
    $(this).find('input[name], select[name]').each(function(){ 
     if ($(this).data('name')){ 
      $(this).attr('name', $(this).data('name')); 
     } 
    }); 
} 

그러나, 나는이 누락 된 이름 attrs에 복구 할 필요가 없다고 가정한다, 그래서 우리가 양식을 제출하기 때문에 이것은 매우 일반적인 경우가 아니라 생각 : 여기에이 문제를 방지하는 방법입니다.

Answer 8

또는 직렬화, 정규식 맑은 하늘의 키 = 값 쌍 및 통화에서는 window.location은 :

$("#form").submit(function(e){ 
    e.preventDefault(); 
    //convert form to query string, i.e. a=1&b=&c=, then cleanup with regex 
    var q = $(this).serialize().replace(/&?[\w\-\d_]+=&|&?[\w\-\d_]+=$/gi,""), 
    url = this.getAttribute('action')+ (q.length > 0 ? "?"+q : ""); 
    window.location.href = url; 
});