ruby-on-rails - 大型下拉列表

Question

我想制作一个像 Rails gudes 站点 ( http://guides.rubyonrails.org/ ) 中使用的那种或 BaseCamp.C 中使用的那种那样的大型下拉菜单。它们可以使用 Rails 表单助手来完成吗？

Answer 1

不是自动的，不是。 “大型下拉列表”实际上只是一个 DIV 元素，其位置看起来就像打开的“指南索引”一样。您所要做的就是定位 DIV，使其看起来正确。

在您提供的网站中，这是通过将 DIV 嵌套在包含“指南索引”元素的元素内来完成的。像这样的事情:

<outerelement style="position: relative; top: 0px; left: 0px">
  <a href="#">Guide Index</a>
  <div id="index" style="position: absolute; top: 0px; left: 0px; display: none">
     <!-- all the items in the guide index -->
  </div>
</outerelement>

我一时记不起如何使用 Rails 中的原型(prototype)助手来生成它，但是当单击“指南索引”链接时，您只需要一些 Javascript 代码即可执行此操作:

 Element.toggle('index');

可能是这样的:

 <%=link_to_function("Guide Index", "Element.toggle('index')")%>

因此，您最终在 .rb 文件中得到的是:

<outerelement style="position: relative; top: 0px; left: 0px">
  <%=link_to_function("Guide Index", "Element.toggle('index')")%>
  <div id="index" style="position: absolute; top: 0px; left: 0px; display: none">
     <!-- all the items in the guide index -->
  </div>
</outerelement>