레일 4, 부트 스트랩 및 f.radio_button

표준 양식을 레일에 작성하고 있지만 sass-bootstrap을 사용하여 더보기 좋은 인터페이스를 제공합니다.레일 4, 부트 스트랩 및 f.radio_button

제 질문은 f.radio_button 입력의 부트 스트랩 라벨링의 사용으로 확장됩니다. 아래는 내가 사용하고있는 코드입니다.

<div class="btn-group" data-toggle="buttons-radio"> 
    <%= f.label :activity %><br> 
    <%= f.radio_button :activity, "Load/Unload", :id=>"Load/Unload" , :style=>"display:none;" %> 
    <label for="Load/Unload" class="btn btn-primary">Load/Unload</label> 

    <%= f.radio_button :activity, "Begin shift", :id=>"Begin shift" , :style=>"display:none;" %> 
    <label for="Begin shift" class="btn btn-primary">Begin shift</label> 

    <%= f.radio_button :activity, "Complete shift", :id=>"Complete shift", :style=>"display:none;" %> 
    <label for="Complete shift" class="btn btn-primary">Complete shift</label> 
</div>

이제 제출 버튼을 클릭하기 전까지는 모양이 좋고 (클릭하면 선택한 버튼이 활성 디스플레이로 전환됩니다) 작동합니다. 이 시점에서 선택한 입력은 양식에 추가되지 않고 : 활동 변수는 공백으로 남습니다.

div 클래스 = "btn-group"을 제거하면 ... 버튼을 클릭하면 데이터를 입력하지만 비주얼 버튼이 변경되지 않습니다.

왜 그런지에 대한 아이디어가 있으십니까? 이것을 촉진하기 위해 jquery를 사용해야합니까? 난 아직도 내부 라벨을 교체해야하지만, 그것이 잘 작동

 <%= f.label "Select Network type:", :class=>"control-label input-group" %> 
     <div class="btn-group" data-toggle="buttons"> 
     <label class="btn btn-default"> 
      <%= f.radio_button :network_type, false %>Optical 
     </label> 
     <label class="btn btn-default active"> 
     <%= f.radio_button :network_type, true, :checked=>"checked" %>IP&Optical 
     </label> 
     </div>

감사

출처

2014-04-19 user3357855