2012-05-12 8 views
6

私はTwitterのブートストラップを使用しており、処理のために区切られたチェックボックスのリストを私のサーバに渡す必要があります。チェックボックスHTMLは次のようになります。複数のチェックボックス値を1つの名前で渡すことはできますか?

<div class="controls"> 
    <label class="checkbox"><input type="checkbox" name="my_match[]" value="190">TEST 190</label> 
    <label class="checkbox"><input type="checkbox" name="my_match[]" value="200">TEST 200</label> 
    <label class="checkbox"><input type="checkbox" name="my_match[]" value="210">TEST 210</label> 
</div> 

... 

$.post("form.php", $("#form_id").serialize(), function(){ 
    ... 
}); 

私はjqueryのを使用してシリアライズされた文字列としてフォームの値を渡しているが、値がそうのように送信されている:

my_match=190&my_match=200 

は、それらを送信することが可能です次の形式ですか?

my_match=190:200 

私は自分のHTMLを変更する必要があるかわかりませんが、これはjavascriptで処理する必要があります。何かご意見は?

答えて

12

何か:

<div class='controls'> 
    <label class="checkbox"> 
     <input type="checkbox" name="my_match[]" value="190">TEST 190</label> 
    <label class="checkbox"> 
     <input type="checkbox" name="my_match[]" value="200">TEST 200</label> 
    <label class="checkbox"> 
     <input type="checkbox" name="my_match[]" value="210">TEST 210</label> 
</div> 

<form> 
    <input id='my_match' type='hidden' name='my_match[]' /> 
    <button>Submit</button> 
</form> 

$('form').submit(function() { 
    var arr=[]; 

    $('input:checked[name=my_match[]]').each(function(){ 
     arr.push($(this).val()); 
    }); 

    $('#my_match').val(arr.join(':')); 
    alert($('#my_match').val()); 

    // Prevent actual submit for demo purposes: 
    return false; 
}); 
​ 
​ 

Try out the fiddle


編集:これは、チェイスは彼の答えで説明した、まさに基本的です。私の知る限り

、あなたが扱うことができ、一般的な解決策が必要な場合は、それが複雑になるため、JavaScriptが彼らに区切りの文字列を作るための唯一の方法である:Googleがここにもたらします誰のために

+0

これと隠れたフィールドの組み合わせがトリックでした。ありがとう! – Paul

4

同じ名前のチェックボックスはカンマ区切りのリストで返されます。あなたができることは、隠しフィールドを作成し、あなたがチェックしたチェックボックスの値をあなたが望むように追加してから、隠しフィールドを送信することです。トリックを行うだろう。このような

0

可能なすべてのセパレータを使用可能にし、セパレータが値の文字列の1つに現れる場合は、セパレータをエスケープします。

可能であれば、my_match=190&my_match=200形式を受け入れ、サーバー上で変換することを強くお勧めします。

PHPでは、名前の末尾に[]を置くと自動的に表示されます。 Pythonのような他の言語では、通常は単一の値ではなくリストを返す特別なゲッターがあります。 (例:Djangoのrequest.POST.getlist('my_match')

脆弱な接続、ネットワークの不具合、またはアプリケーションレイヤーの壊れたファイアウォールが原因で、JavaScriptが読み込まれない、またはユーザーのために十分に遅くなる可能性があるため、JavaScriptを使用するとページが壊れやすくなりますそれなしで送信をクリックしてください。

(JavaScriptがロードされるまで[送信]ボタンを無効にすると、あなたの訪問者を怒らせたり、邪魔したりします。 )あなたの行動が最初の印象にどのように影響するか常に心に留めておいてください。フォールバックなしのドロップダウンメニューなど、JavaScriptによってはJavaScriptに依存します軽く、JavaScriptを送信するなどが必要です)NoScriptのようなJavaScriptのホワイトリストツールを使用している私のような人を悩まします:

  1. ウェブ広告を作成して「調査してください」あなたは絶対にこのような状況ではJavaScriptを使用しなければならない場合は、タブのトンを持っていることの低迷を削減
  2. あまり迷惑格子間および拡張オープン
  3. リミット0日間が利用するという可能性が

を成功します<noscript>タグを使用して、のJavaScriptを有効にしてリロードするように警告してからのフォームに必要事項を記入してください。

関連する問題