###前提・実現したいこと
Railsを使ったアプリケーションで
Bootstrapを用いてcheckboxをボタン化させたい
###発生している問題・エラーメッセージ
collection_check_boxesを用いて動的にフォームを作成しているのですが
checkboxがデフォルトでcheckedとなっている際にボタンがactiveになりません
###該当のソースコード
HTML
1<div class="btn-group" data-toggle="buttons-checkbox"> 2 3 <p><label class="btn" for="user_task_ids_1" aria-pressed="false"> 4 <input type="checkbox" value="1" name="user[task_ids][]" id="user_task_ids_1">A 5 </label> </p> 6 7 <p><label class="btn " for="user_task_ids_2"> 8 <input type="checkbox" value="2" checked="checked" name="user[task_ids][]" id="user_task_ids_2">B 9 </label> </p> 10 11 <p><label class="btn" for="user_task_ids_3" aria-pressed="false"> 12 <input type="checkbox" value="3" checked="checked" name="user[task_ids][]" id="user_task_ids_3">C 13 </label> </p> 14 15</div>
Ruby
1<div class="btn-group" data-toggle="buttons-checkbox"> 2 <%= f.collection_check_boxes :user_task_ids, Task.all, :id, :task_name, include_hidden: false do |t|%> 3 <p><%= t.label(class:'btn') { t.check_box + t.text } %> </p> 4 <% end %> 5</div>
###試したこと
以下のjsコードを記述したのですがいまいちうまく動きませんでした。
JavaScript
1$('.btn-group').on('input', 'change', function(){ 2 var checkbox = $(this); 3 var label = checkbox.parent('label'); 4 if (checkbox.is(':checked')) { 5 label.addClass('active'); 6 } 7 else { 8 label.removeClass('active'); 9 } 10});
###補足情報(言語/FW/ツール等のバージョンなど)
Rails4.2
Ruby2.2.2
BootStrap-sassを用いてます
回答3件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/08/05 02:06