Question

我有3个引导开关来处理读/更新/创建权限。他们的区域写成：

<%= f.check_box :allow_read, :data => { :size=>'medium', 
   'on-color'=>'success', 'on-text'=> "#{t('yes').upcase}", 
    'off-text'=> "#{t('no').upcase}" } %>


<%= f.check_box :allow_update, :data => { :size=>'medium', 
   'on-color'=>'success', 'on-text'=> "#{t('yes').upcase}", 
    'off-text'=> "#{t('no').upcase}" } %>

<%= f.check_box :allow_create, :data => { :size=>'medium', 
   'on-color'=>'success', 'on-text'=> "#{t('yes').upcase}", 
   'off-text'=> "#{t('no').upcase}" } %>

并显示为：

我正在尝试使用switchChange.bootstrapSwitch方法在用户切换一个开关时更改其他é开关。

当：allow_read被关闭时，则：allow_update和：allow_create也应该关闭......

所以我编写了以下js代码来处理这种情况......

 $('input[name="permission[allow_read]"]').on('switchChange.bootstrapSwitch', function(event, state) {
      if (event.type == "switchChange" && state == false){
        $('input[name="permission[allow_update]"]').bootstrapSwitch('state', false, true); // disallow update
        $('input[name="permission[allow_create]"]').bootstrapSwitch('state', false, true); // disallow create
      }
    });

但它工作不正常......因为它在切换之前插入和关闭文本，但是执行切换：

可能出错？

感谢您的反馈

- 更新--- 忘了添加生成的HTML ...

<div class="col-sm-9">
  <input name="permission[allow_read]" type="hidden" value="0">
  <div class="bootstrap-switch bootstrap-switch-wrapper bootstrap-switch-on bootstrap-switch-medium bootstrap-switch-animate bootstrap-switch-id-permission_allow_read">
      <div class="bootstrap-switch-container">
          <span class="bootstrap-switch-handle-on bootstrap-switch-success">OUI</span>
          <label class="bootstrap-switch-label">&nbsp;</label>
          <span class="bootstrap-switch-handle-off bootstrap-switch-default">NON</span>
          <input type="checkbox" value="1" checked="checked" name="permission[allow_read]" id="permission_allow_read">
      </div>
  </div>
</div>

Answer 1

我猜Rails视图助手和Bootstrap开关生成的html有问题...
回到标准的html标签，它可以正常工作

            <div class="row">
              <div class="col-sm-12">
                <div class="form-group">
                  <p  class='col-sm-3 control-label' >READ</p>
                  <div class="col-sm-9">
                    <input id="allow_read" name="permission[allow_read]" type="checkbox" value="1"  data-size ='medium', data-on-color ='success' data-on-text = "YES" data-off-text = "NO" />
                  </div>
                </div>
              </div>
            </div>

以及用于更新和创建的类似开关...... js脚本运行得非常好......

rails 4：使用Bootstrap Switch更改状态问题

1 个答案: