这篇文章主要解决的问题是用attachment插件和responds_to_parent插件实现ajax方式上传文件(图片)的目的。
Step 1. Choose a file upload plugin(选择上传插件)
可用的上传插件有如下三种:
[list=]1.file_column
2.acts_as_attachment
3.attachment_fu [/list]
推荐attachment fu+rails1.2.
Step 2. 选择安装Rmagic
gem install rmagic
Step 3. 新建项目并下载插件attachment_fu
新建项目demo
引用
rails demo
安装插件attachment_fu:
引用
cd demo
ruby script/plugin install http://svn.techno-weenie.net/projects/plugins/attachment_fu/
Step 4. 开始编写代码
用下面命令创建一个rails资源asset
引用
ruby script/generate scaffold_resource asset filename:string content_type:string size:integer width:integer height:integer parent_id:integer thumbnail:string created_at:datetime
下面是自动生成的migration,可自行修改,在此我们使用默认。
class CreateAssets < ActiveRecord::Migration
def self.up
create_table :assets do |t|
t.column :filename, :string
t.column :content_type, :string
t.column :size, :integer
t.column :width, :integer
t.column :height, :integer
t.column :parent_id, :integer
t.column :thumbnail, :string
t.column :created_at, :datetime
end
end
def self.down
drop_table :assets
end
end
在模型中,我们加入以下代码:
class Asset < ActiveRecord::Base
has_attachment :storage => :file_system,
:max_size => 1.megabytes,
:thumbnails => { :thumb => '80x80>', :tiny => '40x40>' },
:processor => :Rmagick
end
Step 5. AJAX it
把Javascript prototype/scriptaculous 加入layout.
<%= javascript_include_tag "prototype", "effects", "application" %>
安装插件responds_to_parent
ruby script/plugin install http://sean.treadway.info/svn/plugins/responds_to_parent/
修改index.rhtml:
<% form_for(:asset, :url => formatted_assets_path(:js),
:html => { :multipart => true,
:target => 'upload_frame'}) do |form| %>
<%= render(:partial => '/assets/form', : object => form) %>
<% end %>
<iframe id='upload_frame' name="upload_frame" style="width:1px;height:1px;border:0px" src="about:blank"></iframe>
<ul id="assets">
<% @assets.each do |a|%>
<%= render(:partial => '/assets/list_item', : object => a)%>
<% end %>
</ul>
新建一个局部模版文件_form.rhtml:
<p>
<label for="uploaded_data">Upload a file:</label>
<%= form.file_field :uploaded_data %>
</p>
<p>
<%= submit_tag "Create" %>
</p>
新建一个局部模版文件_list_item.rhtml:
<li id="asset_<%= list_item.id %>">
<%= link_to(image_tag(list_item.public_filename(:thumb))) %><br />
</li>
修改assets_controller.rb中的create方法如下:
def create
@asset = Asset.new(params[:asset])
respond_to do |format|
if @asset.save
flash[:notice] = 'Asset was successfully created.'
format.html { redirect_to asset_url(@asset) }
format.xml { head :created, :location => asset_url(@asset) }
format.js do
responds_to_parent do
render :update do |page|
page.insert_html :bottom, "assets", :partial => '/assets/list_item', : object => @asset
page.visual_effect :highlight, "asset_#{@asset.id}"
end
end
end
else
format.html { render :action => "new" }
format.xml { render :xml => @asset.errors.to_xml }
format.js do
responds_to_parent do
render :update do |page|
# update the page with an error message
end
end
end
end
end
end
最后别忘了,修改config文件夹中的database.yml文件,创建相应的数据库,并执行命令:
rake db:migrate
ruby script/server
然后到浏览器里面查看效果吧!
注:本文翻译自http://khamsouk.souvanlasy.com/。更详细的介绍请访问原文。另外本篇所介绍的内容经过测试没有问题。欢迎讨论交流
- 描述: 效果图
- 大小: 2.3 MB
分享到:
相关推荐
agile_web_development_with_rails_3rd_edition.9994652073.pdf
ruby_on_rails_3_入门教程(中文)
使用swf_fu插件,Rails会将您的swf文件像其他任何资产一样对待(图像,javascript等)。 swf_fu (发音为“ swif-fu”,法语使用者的笑话)使用SWFObject 2.2将swf对象嵌入HTML并支持其所有选项。 SWFObject 2是一...
jack_up, 在 Rails 中,[DEPRECATED] 轻松AJAX文件上传 从October年8 月开始,已经不推荐使用 另外,对于其他的, 付费和免费的上传工具,JackUp已经被否决了。 JackUp简单AJAX文件在 Rails 中上传。安装修改你的...
这个简单的插件使您能够调用to_xls到Rails的数组集合。 数组元素支持对象:ActiveRecord,Mongid,哈希。 在您的Gemfile中: gem 'to_xls-rails' # Last officially released gem # gem "to_xls-rails", :git => ...
version_fu version_fu是一个ActveRecord版本控制插件,该插件基于Rails 2.1中引入的脏属性检查。 已对其进行更新以与Rails 3兼容。安装 gem install version_fu如果您使用的是Rails 3,请将其添加到Gemfile中gem '...
用简单的定义语法替换了固定装置,支持多种构建策略(保存的实例,未保存的实例,属性哈希和存根对象),并且支持同一类的多个工厂( user , admin_user等),包括工厂继承。 从factory_girl_rails过渡? 查看 。...
(现在兼容Banana和Rails 3!) 现在跳舞!混合蛋白该插件为您的食谱书引入了三种混合: actions_as_voteable :适用于帖子,评论等内容对象。 actions_as_voter :供投票实体(例如用户)使用。 has_karma :用于...
rails_semantic_logger, Rails 语义记录器用语义记录器替换 Rails 缺省记录器 Rails 语义记录器 语义记录器用语义记录器替代 Rails 缺省记录器。http://github.com/rocketjob/rails_semantic_logger文档有关完整文档...
jruby_on_rails 开发的很好例子,可以看看,有助与初学者入门
Redmine 搭建 Ruby_Ruby_on_Rails 项目管理系统
化身对于Rails开发 Avatars For Rails 是一个完整的解决方案,可为模型提供头像支持。 它包括一个数据库迁移和带有 jquery.fileupload 和 jquery.jcrop 的视图 它依赖于回形针和 ...在您的模型中,您必须包括
ruby_on_rails 开发者实战 源代码上 1-12章 来之不易啊。仅供学习.
Ajax-select_all-rails.zip,易于选择和取消选择所有复选框,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页,其中网页的小部分在不重新加载网页的...
Ruby on Rails Guides v2 - Ruby on Rails 4.2.5
Api-api_on_rails.zip,学习使用rubyonrails5/6构建api的最佳实践学习使用rubyonrails5/6构建api的最佳实践。本书的目的不仅仅是教你如何用rails构建api。目的还在于教您如何用rails构建可伸缩和可维护的api,这意味...
导出为CSV on Rails的 这个简单的插件使您能够调用 to_csv 到一系列活动记录。 除了 :include 之外,构建器选项与 to_json / to_xml 相同。入门 在您的 Gemfile 中: gem 'to_csv-rails' # Last officially released...
中文世界唯一一本Rails 4.0.0 + Ruby 2.0.0 的自學書籍
Ruby_on_Rails实践.rar
themes_on_rails, 向 Rails 3/4/5 应用程序添加多个主题支持 ThemesOnRails 安装安装最简单的方法是使用 Bundler 。将这里 gem 添加到你的Gemfile:gem 'themes_on_rails'如果要对 liquid 模板使用