- Arden
- 等级:
- 性别:
- 文章: 318
- 积分: 759
- 来自: 深圳
|
今天花了一小段时间写了个基于Rails和xtree的树形例子,还有很多地方需要完善,并且代码比较乱!
Migrate类
- class CreateCategories < ActiveRecord::Migration
- def self.up
- create_table "categories", :force => true do |t|
- t.column "name", :string
- t.column "created_at", :datetime
- t.column "parent_id", :integer, :default => 0, :null => false
- end
- %w(item1 item2 item3 item4 item5).each do |name|
- parent = Item.new(:name=>name)
- parent.save
- Item.create(:name=>name+".1", :parent_id=>parent.id)
- Item.create(:name=>name+".2", :parent_id=>parent.id)
- Item.create(:name=>name+".3", :parent_id=>parent.id)
- end
- end
-
- def self.down
- drop_table :categories
- end
- end
表结构
- CREATE TABLE categories (
- id int(11) NOT NULL PRIMARY KEY,
- name varchar(50),
- parent_id int(11)
- ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_bin COMMENT='类别表';
控制类
- class CategoryController < ApplicationController
- def index
- @categories = Category.roots
- end
- end
Helper类
- module CategoryHelper
- def get_tree(trees, parent)
- tree_html = "";
- trees.each do |tree|
- if tree.is_root?
- tree_html += "var tree_#{tree.id} = new WebFXTreeItem('#{tree.name}');\r\n"
- tree_html += "rootTree.add(tree_#{tree.id});\r\n"
- end
-
- if !tree.is_leaf?
- if !tree.is_root?
- tree_html += "var tree_#{tree.id} = new WebFXTreeItem('#{tree.name}');\r\n"
- tree_html += "tree_#{parent.id}.add(tree_#{tree.id});\r\n"
- end
- tree_html += get_tree(tree.children, tree)
- else
- tree_html += "var tree_#{tree.id} = new WebFXTreeItem('#{tree.name}');\r\n"
- if !parent.nil?
- tree_html += "tree_#{parent.id}.add(tree_#{tree.id});\r\n"
- end
- end
- end
- return tree_html
- end
- end
模型类category.rb
- class Category < ActiveRecord::Base
- acts_as_tree
- validates_presence_of :name
-
- def self.roots
- self.find(:all, :conditions=>["parent_id = ?", 0])
- end
-
- def is_leaf?
- return !self.has_children?
- end
-
- def is_root?
- return self.parent_id == 0
- end
- end
视图文件
- <html>
- <head>
- <title>tree</title>
- <script type="text/javascript" src="/javascripts/xtree.js"></script>
- <script type="text/javascript" src="/javascripts/xloadtree.js"></script>
-
- <link type="text/css" rel="stylesheet" href="/stylesheets/xtree.css" />
- </head>
-
- <body>
- <script type="text/javascript">
- var rootTree = new WebFXTree('Root');
- <%= get_tree(@categories, nil)%>
- document.write(rootTree);
- </script>
- </body>
- </html>
效果图如下:
注意:需要将xtree组件的xtree.js xtree2.js xloadtree.js拷贝到javascripts目录,把xtree组件里images
目录下的文件拷贝到rails下的public/images目录下,把xtree组件里的xtree.css拷贝到rails下的stylesheets
目录下!
声明:ITeye文章版权属于作者,受法律保护。没有作者书面许可不得转载。
|
返回顶楼 |
|
|
- vfany
- 等级: 初级会员
- 性别:
- 文章: 25
- 积分: 30
- 来自: 重庆
|
动态的添加删除不知道楼主做了没?
|
返回顶楼 |
|
|
- nixiaode
- 等级: 初级会员
- 性别:
- 文章: 5
- 积分: 38
- 来自: 成都
|
can't convert nil into String
Extracted source (around line #11):
8: <body>
9: <script type="text/javascript">
10: var rootTree = new WebFXTress('Root');
11: <%= get_tree(@categories, nil)%>
12: rootTree.write();
13: </script>
14: </body>
|
返回顶楼 |
|
|