Question

我对Rails相当新。我能够正确地使用onclick来运行f.checkbox。

现在我正在尝试为_form中的f.select做类似的事情。

这是我的复选框工作代码 erb部分：

<div class="row"> 
  <div class="col-md-4">
    <div class="field">
      <%= f.label :air? %>
      <%= f.check_box :air, :id => "chk_air", :onclick => "manageAirDisp();" %>
    </div>
  </div>

  <% if request.air? %>
    <div class="col-md-4", id="MultiButton", style="display: block">
  <% else %>
    <div class="col-md-4", id="MultiButton", style="display: none">
  <% end %>
      <button onclick="showAirMulti(); return false;", class="btn-custom-normal">Show/Hide Multi-Destinations</button>
    </div>
</div>

在_frm之上的相应脚本部分：

function manageAirDisp (){
  var checkbox = document.getElementById('chk_air');
  // this check below checks if checkbox is checked or not.
  if (checkbox.checked){
    document.getElementById("air_div").style.display = "block";
    document.getElementById("MultiButton").style.display = "block";
  } else {
    document.getElementById("air_div").style.display = "none";
    document.getElementById("MultiButton").style.display = "none";
  }

}

现在我无法使用dorp down选项来代替： erb部分：

<div class="row"> 
  <div class="col-md-4">
    <div class="field">
      <%= f.label :event %>
      <!-- < f.check_box :event, :id => "chk_event", :onclick => "manageEvent();" > -->
      <%= f.select :event, [['Unkown', 'unk'], ['yes', 'yes'], ['no', 'no']], :onchange => "manageEvent();" } %>
    </div>
  </div>
</div>

<div class="row",  id="event_blk", style="display: none">
  <div class="col-md-4">
    <div class="field">
      <%= f.label :registration, "addQuestion?" %>
      <%= f.check_box :addquestion %>
    </div>
  </div>
</div>

现在我可以开始工作的相应脚本部分：

function manageEvent(){
  var checkbox = document.getElementById('chk_event');
  // this check below checks if checkbox is checked or not.
  if (selection.val() = "yes"){
    document.getElementById("event_blk").style.display = "block";
  } else {
    document.getElementById("event_blk").style.display = "none";
  }
   // to check on value instead it should look as follows:
  // if (checkbox.val() = "something") {  then do something }

}

所以我想做的是当用户选择＆＃34;是＆＃34;时，让部分event_blk变得可见。并且只要他们选择了它，或者只要他们选择no或unk

就使其不可见

感谢您的帮助

Answer 1

您似乎没有声明selection - 您正在设置变量checkbox。

此外，您应该使用.value代替.val()。

试试这个：

function manageEvent(){

    // change checkbox to selection
    var selection = document.getElementById('chk_event');

    // changed selection.val() to selection.value
    if (selection.value == "yes"){
        document.getElementById("event_blk").style.display = "block";
    } else {
        document.getElementById("event_blk").style.display = "none";
    }
}

更新

您还需要修复select帮助器。如果你查看documentation，你会发现select助手接受的最后两个参数是options哈希和html_options哈希。您需要在:onchange哈希中传递html_options。此外，Rails默认为[model_name]_[attribute_name]作为id元素的select，因此如果您需要，还需要在:id => "chk_event"哈希中传递html_options将该字符串用作id：

<div class="row"> 
  <div class="col-md-4">
    <div class="field">
      <%= f.label :event %>
      <!-- < f.check_box :event, :id => "chk_event", :onclick => "manageEvent();" > -->
      <%= f.select :event, 
                   [['Unkown', 'unk'], ['yes', 'yes'], ['no', 'no']],
                   {}, #empty options hash
                   { :id => "chk_event", :onchange => "manageEvent();" } %>
    </div>
  </div>
</div>

RoR rails，f。选择onchange of value，使html的部分可见

1 个答案: