在提交之前从表单的参数中删除空值

Question

我有一些javascript捕获表单的更改然后调用表单的常规提交功能.表单是一个GET表单(用于搜索),我在params中有很多空属性.我想做的是在提交之前删除任何空属性,以获得更清晰的URL:例如,如果有人更改'主题'选择'英语'我想要他们的搜索网址是

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

而不是

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

就像现在一样.这纯粹是为了有一个更清晰,更有意义的网址链接到人们的书签等等.所以,我需要的是这些内容,但这是不对的,因为我不是在编辑实际的表格但是一个由表格的参数制作的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

我觉得我很接近这个,但我错过了如何编辑实际表单的属性而不是创建另一个对象并编辑它的步骤.

感谢任何建议 - 最多

编辑 - 解决 - 感谢许多发布此事的人.这就是我所拥有的,这似乎完美无缺.

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

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