Question

目前我有一个两个下拉列表，一个表示角色，另一个表示归档。我的代码是

<div class="field">
    <% f.label :role %>
    <%= f.select :role, options_for_select(%w(Investigator Manager Director)) %>
</div>
<div class="field">
    <h4>Assigning to</h4>
    <%= f.collection_select( :assigned_to, User.find_all_by_role("Manager"), :id, :email)  %>
</div>

我希望只有在第一个下拉列表中选择了调查员时才会出现第二个下拉列表。关于如何实现这一目标的任何建议

Answer 1

您将要使用jquery和javascript来完成此任务。另一个很好的资源是ryan bates关于确切问题的railscast。

你基本上想做的是有一些javascript正在观察:role下拉框的当前值。通常，您会通过.bind (.on)检查下拉菜单的更改事件。然后，您希望根据该值显示/隐藏:assigned_to框。由于这似乎是一组堆栈选项，它应该是一个非常简单的javascript。

jQuery ->
  ($ 'select#assigned_to').hide()
  ($ 'select#role').change ->
    role = ($ 'select#role :selected').text()
    if role is 'Investigator'
      ($ 'select#assigned_to').show()

现在很明显那是coffeescript，应该相应地进行转换，但这应该可以帮助你弄清楚需要做些什么。

Answer 2

我最近处于类似情况，虽然我确定你的问题已经解决了，但我认为这仍然有助于其他可能寻求答案的人。

$(document).ready(function () {
    prevOrigin = "";
    prevDestination = "";
    $('#origin').change(function() {
        var selected = $(":selected",this).text();
        $('#destination option:contains("' + prevOrigin +'")').removeAttr("disabled");
        $('#destination option:contains("' + selected +'")').attr("disabled","disabled");
        prevOrigin = selected;
    });

    $('#destination').change(function() {
        var selected = $(":selected",this).text();
        $('#origin option:contains("' + prevDestination +'")').removeAttr("disabled");
        $('#origin option:contains("' + selected +'")').attr("disabled","disabled");
        prevDestination = selected;
    });
});

请参阅demo

根据rails中上面下拉列表的选择禁用下拉列表

2 个答案: