どのように選択したラジオボタンの値

Question

を追加し、フォームのアクションを変更するために、私はこれらのようないくつかのラジオボタンを持つHTMLフォームがあります

<form action = "/somecomplicatedurl" method="post"> 
    <ul id="category_list"> 
    <li> 
     <label for="Foo"> 
     <input type="radio" name="category" id="foo" value="foo" onclick="this.form.submit()" /> 
     Foo</label> 
    </li> 
    <li> 
     <label for="Bar"> 
     <input type="radio" name="category" id="bar" value="bar" onclick="this.form.submit()"/> 
     Bar</label> 
    </li>    
    <li> 
     <label for="Spam"> 
     <input type="radio" name="category" id="spam" value="spam" onclick="this.form.submit()"/> 
     Spam</label> 
    </li> 
    </ul> 
</form> 

私はアクションにクエリ文字列を追加したいonclickイベント、オン/somecomplicatedurl選択したカテゴリを追加します。例えば

、カテゴリspamをクリックすると、このようなアクションを持つHTTPポストを発射する必要があります

/somecomplicatedurl?category=spam 

は、JavaScriptやjQueryのはどちらも有効です。

EDIT：
カテゴリ値はすでにサーバーに正しく渡されています。 ラジオボタンをクリックすると、ブラウザのアドレスバーに表示されているURLに選択したカテゴリが含まれています。 *

^{私は現在、その/ somecomplicatedurlルート}

Answer 1

POST/GET変数の混合は、不良なフォームと見なされます。非表示のフォームフィールドを動的に設定しないでください：

<input type="hidden" id="category" name="category" value="spam" /> 

代わりに、

あなたのonclickはなる：

onClick="document.getElementById('category').value = this.value; this.form.submit();" 

---

それだけで表示の問題だ場合、

onclick="this.form.action='/somecomplicatedurl?category=' + this.value; this.form.submit();" 

Answer 2

申し訳上の異なる場合を扱うてるので、*私は別のリダイレクトを追加することを回避したいと思いますが、最初にあなたの質問を誤解しました。 あなたは送信する前に、あなたのonClickイベントに

document.this_form.action = "somecomplicatedurl?category=span"; 

を追加して、フォームのアクションを変更することができます。

Answer 3

は、formタグでメソッド "GET" を使用すると、何を達成するだろうと私には思えますあなたが欲しい、または私は質問を誤解しています...

Answer 4

getに変更するのはprobabです一番簡単なのですが、それより少し複雑ですが、ここではいくつかのjQueryがあります。これらのインラインスクリプトを取り出して、次のように書く：

$(function() { 
    $('#category_list input').change(function() { 
     var jQthis = $(this), 
      jQform = $(this).parents('form'), 
      currentAction = jQform.attr('action'), 
      // This removes the current query, if you've added one. 
      newAction = currentAction.split('?').shift(); 

     // Work out the new action and set it. 
     newAction += jQthis.val(); 
     jQform.attr('action', newAction); 

     // Submit the form, since your previous handlers were doing that. 
     jQform.submit(); 

    }); 
});