使用prototype.js插件AJAX上传

问题描述:

如何使用AJAX通过使用prototype.js插件上传的图像文件,我需要显示这些图像被上传后,请帮忙解决这个问题。

How to upload a image file using ajax by using prototype.js plugin, I need to display those image after it is uploaded please help to solve this problem.

感谢

您将需要的东西在服务器上了。

You will need something on the server, too.

我建议使用回形针存储在服务器上的文件。

I recommend using paperclip for storing the files on your server.

一旦你拥有了它设置了,你应该让你的AJAX生成一种形式有文件字段。此外,请记住形式一定要多部分。

Once you have it set up, you should make your ajax generate one form with a "file" field. Also, remember that the form must be multipart.

<% form_for @picture, :html => { :multipart => true } do |f| %>
  <%= f.file_field :file %>
  <%= f.submit "Submit" %>
<% end %>

如果你只需要上传一个文件,你可能并不需要完全的AJAX - 只有普通的JavaScript - 用于显示/隐藏的形式。像这样的:

If you just need to upload one file, you probably don't need full AJAX - only plain javascript - for showing/hiding the form. Like this:

<%= link_to_function 'Show/Hide image upload') do |page|
      page.visual_effect :toggle_blind, 'upload_image'
    end
%>

<div id='upload_image' style='display:none'>
  <% form_for @picture, :html => { :multipart => true } do |f| %>
    <%= f.file_field :file %>
    <%= f.submit "Submit" %>
  <% end %>
</div>

请注意,对于隐藏/显示我使用的是Scriptaculous的效果股利,不只是雏形 - Scriptaculous的获取默认包含在轨道上反正

Notice that for hiding/showing the div I'm using a Scriptaculous effect, not just prototype - scriptaculous gets included by default on rails anyway.