下拉选项中的第一个值应该被禁用 - Rails答案

【问题标题】：First value in drop down option should be disabled - Rails下拉选项中的第一个值应该被禁用 - Rails
【发布时间】：2013-09-10 13:23:28
【问题描述】：

我有一个下拉列表，其中包含以下选项

  ---select an option---
  option 1
  option 2
  option 3
  option 4

我想在下拉列表中禁用我的第一个值---选择一个选项---。以至于无法选择它作为选项。

我的代码在这里

<%= f.select :options, options_for_select([[" ---Select an option---", ""], "option 1", "option 2", "option 3", "option 4"]), :style => "margin:20px; width:356px;" %>

【问题讨论】：

标签： ruby-on-rails ruby

【解决方案1】：

在 Ruby 中它看起来像这样：

<%= f.select options_for_select(["", "Please select", "option 1", "option 2", "option 3", "option 4"], :disabled => "Please select", :selected => "Please select") %>

最好为选择标签分配一个类并将样式移动到您的样式文件中

【讨论】：

非常感谢。它的工作。但我需要从选项中删除“”。

【解决方案2】：

应该是这样的：

<%= f.select :options, [[" ---Select an option---", ""], "option 1", "option 2", "option 3", "option 4"], {}, :style => "margin:20px; width:356px;" %>

另外，最好给它一个 css class 然后在类中而不是在代码中添加边距/宽度/等。（edit - 当我说“更好”时，我只是指一种更好的做法 - 如果您想再次使用相同的格式，您可以添加类，如果您想修改它的外观，您只需修改一个类——它不会改变它的执行方式，它只会让你的代码更容易使用。）

您可以使用span：

<span class="options_select">
  <%= f.select :options, [[" ---Select an option---", ""], "option 1", "option 2", "option 3", "option 4"], {} %>
</span>

【讨论】：

您是遇到错误，还是没有按照您的意愿行事？
第二个想法也行不通。我认为这门课不会有任何问题-@dax
我之前已经添加了完整的代码，没有遗漏任何内容。只有下拉菜单中的选项被重命名。 @dax
查看我所做的更新 - 另外，最后的 {} 是什么？尝试删除它，看看它是否有效。
我也实现了上述内容。没用

【解决方案3】：

好吧，我认为您需要将第一个选项设置为禁用但选择为真。所以它只会在第一次选择第一个选项，然后用户无法选择。

即

<!DOCTYPE html>
<html>
<head>
<script>
function favBrowser()
{
var mylist=document.getElementById("myList");
document.getElementById("favorite").value=mylist.options[mylist.selectedIndex].text;
}
</script>
</head>

<body>
<form>
Select your favorite browser:
<select id="myList" onchange="favBrowser()">
  <option selected="true" disabled="disabled">Select Browser</option>
  <option>Google Chrome</option>
  <option>Firefox</option>  
  <option>Internet Explorer</option>
  <option>Safari</option>
  <option>Opera</option>
</select>
<p>Your favorite browser is: <input type="text" id="favorite" size="20"></p>
</form>
</body>

</html>

希望对你有所帮助..

【讨论】：