使用祖先gem构建大树结构的路由线

Question

我正在使用ancestry宝石并跟随railscasts剧集here以使宝石工作，这非常有效。

我已经创建了一个相当大的祖先树，虽然通过缩进字段来嵌套父节点和子节点，但我更喜欢某种路由线。下图显示了总树的一小部分。

我希望结构看起来像这样/或类似的东西

我尝试通过添加线来玩这个结构，但我似乎最终会冒烟。

每个父母和孩子都有一个单独的div字段（在帮助器中）。就像railscasts一集一样。

def nested_messages(messages)
  messages.map do |message, sub_messages|
    render(message) + content_tag(:div, nested_routes(sub_messages), :class => "nested_messages")
  end.join.html_safe
end

如果可能的话，如何做到这一点。任何提示？

Answer 1

我不会尝试使用div和css技巧创建行。您正在尝试构建UI的元素，如导航树。只需在像jsTree这样的真实UI库中全力以赴。使用rails创建数据结构（您已经完成此操作），呈现静态HTML <ul>列表（这应该很容易将<div>转换为列表元素）。然后让javascript渲染该数据结构的视图（行等），你将获得免费的交互性和其他东西。 ：）

这是主要网站： http://www.jstree.com/

查看此演示： http://www.jstree.com/documentation/core#demos

查看页面的来源，您会看到<div id="demo2" ...>魔法开始发生的地方。

在Rails 3中安装JQuery和这个插件应该相当容易（3.1中你已经有了JQuery）。