1

ここからTwitterBoostrapラジオボタンについて話しています:http ://twitter.github.com/bootstrap/javascript.html#buttons

私は次のようにビューファイルでそれらを使用しました:

<div class="btn-group" data-toggle="buttons-radio">
     <input type="button" name="type" class="btn" value="Car">
     <input type="button" name="type" class="btn" value="Bicycle">
</div>

しかし、フォームを送信してそれらを検証しようとすると、それらの値を取得できません...

echo $_POST['type'];空です...では、上記の「ラジオ」ボタンにアクセスして検証するにはどうすればよいですか?

4

3 に答える 3

1

プラグインは外観に対してのみ機能します。何も設定しません(クラスを除く)。独自のJSを使用して、実際のラジオボタン、または一意の非表示の入力を設定する必要があります。

$('[data-toggle="buttons-radio"] > .btn').on('click',function() {
    $('#someHiddenInput').val($(this).val());
});

デモ(jsfiddle)

とにかく提出されていないようtype="button"です(私のFirefoxでは)。


これは1つのアプローチであり、もう1つは、どちらが.activeクラスを持っているかを送信時に確認することです。

于 2012-10-24T20:08:34.867 に答える
0

シャーブロウの答えから導き出されたエレガントなソリューション。これにより、いくつかのBootstrapスタイルのラジオボタンを使用して、1行のコードで非表示の入力と同期させることができます。あなたがする必要があるのは常に.btn-groupの中に隠された入力を置くことです。

HTML:

        <!-- Vehicle
        ================================================== -->
        <div class="control-group">
            <label class="control-label" for="selectRecipients">Vehicle</label>
            <div class="controls">
                <div class="btn-group" data-toggle="buttons-radio">
                    <button type="button" class="btn" value="car">Car</button>
                    <button type="button" class="btn" value="bicyle">Bicycle</button>
                    <input type="hidden" name="vehicle" value=""></input>
                </div>
            </div>
        </div>

        <!-- Food
        ================================================== -->
        <div class="control-group">
            <label class="control-label" for="selectRecipients">Vehicle</label>
            <div class="controls">
                <div class="btn-group" data-toggle="buttons-radio">
                    <button type="button" class="btn" value="apples">Apples</button>
                    <button type="button" class="btn" value="oranges">Oranges</button>
                    <input type="hidden" name="food" value=""></input>
                </div>
            </div>
        </div>

JQUERY:

    /** Associate UI-only radio buttons with hidden fields **/
    $('[data-toggle="buttons-radio"] > button').on('click', function() {
        $(this).parent().find('input[type=hidden]').val( $(this).val() );
        alert( $(this).parent().find('input[type=hidden]').val() );
    });

デモ: http: //jsfiddle.net/KyHMp/1/

ライブ設定では、ボタンの1つをデフォルトのアクティブボタン(.active)として設定し、非表示フィールドにデフォルト値を指定します。

私はそれが誰かを助けることを願っています。

于 2013-02-15T21:56:01.517 に答える
-1

これは実際にはTwitterBootstrapとは関係ありません。「name」属性には一意の名前を付けることを検討する必要があります。

于 2012-10-23T01:31:31.637 に答える