使用祖先寶石構建大型樹形結構的路由線

Question

我使用的是ancestry gem，並且遵循railscasts集here以使gem正常工作，這非常完美。

我已經創建了一個相當大的祖先樹，雖然父母和孩子通過縮進字段嵌套，我更喜歡某種路由線。下圖顯示了整個樹的一小部分。

我想有一個結構，這個樣子的/或類似

我試圖通過添加幾行玩的結構的東西，但我似乎只是最終冒煙。

每個家長和孩子都會得到一個像這樣的單獨的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）。