フォームにラジオ ボタンとして機能するブートストラップ ボタン グループがあります。ユーザーがオプションの 1 つ (この場合は「1 日」) を選択した場合、フォームの残りの部分を検証する必要があります。検証が失敗した場合は、Single Day の「クリックを解除」する必要があります。基本的に、「Multi Day」が視覚的に選択されたままになるように、ラジオ ボタンの選択を元に戻します。
私が試した3つのソリューションを使用して、簡単なフィドルの例を作成しました:http://jsfiddle.net/u5Ab4/
解決策 1 - ボタン グループなので、グループを切り替えて選択を変更できるのではないかと考えました
解決策 2 - グループの切り替えが機能しなかったため、個々のボタンを切り替える必要があるのでしょうか?
解決策 3 - トグルは失敗です。アクティブなクラスを手動で追加/削除するのはどうですか?
JSFiddle コード
HTML:
<div id="session_type" class="btn-group" data-toggle="buttons-radio">
<button type="button" class="btn">Single Day</button>
<button type="button" class="btn active">Multi Day</button>
</div>
JS:
$('#session_type > button.btn').on("click", function () {
//attempt 1 - since it's a radio button-style button group, i thought i could toggle the whole group (ie switch which button was selected)
$('#session_type').button("toggle");
//attempt 2 - toggle the button that was clicked (ie. single day) to unselect it (might need to toggle the other button as well, to select it instead, but this doesnt work at all)
//$(this).button("toggle");
//manually add/remove the active class from each button (again, would probably need to add the class to the other button as well, but it doesnt work)
//$(this).removeClass("active");
});