我正在尝试使用以下表单进行异步上传,但是微博#create正在响应
HTML请求.关于如何使我的上传表格发送JS请求的任何建议?
应用程序/视图/共享/ _micropost_form.html
<%= form_for @micropost,:html => {:multipart => true} do |f| %> <%= f.file_field :picture,:multiple => true,:name => "file_folder[picture]" %> <div><%= f.text_area :content,placeholder: "Caption (Optional)",id: "post-micropost-area" %></div> <div align="center"><%= f.submit "Post",class: "button postbutton" %></div> <% end %> <script> $(document).ready(function() { var multiple_photos_form = $('#new_file_folder'); multiple_photos_form.fileupload({dataType: 'script' add: function (e,data) { types = /(\.|\/)(gif|jpe?g|png|bmp)$/i; file = data.files[0]; if (types.test(file.type) || types.test(file.name)) { data.submit(); } else { alert(file.name + " must be GIF,JPEG,BMP or PNG file"); } } }); }); </script>
应用程序/资产/ JavaScript的/ microposts.coffee
(带有表单的页面由static_pages #home呈现 – 这可能很重要吗?)
jQuery -> $('#micropost_form').fileupload dataType: "script"
应用程序/控制器/ micropost_controller.rb
def create @micropost = current_user.microposts.new(micropost_params) @micropost.hashtags = @micropost.content.scan(/#\w+/).flatten.join(",") if @micropost.save flash[:success] = "Post Created!" respond_to do |format| format.html {redirect_to root_url } format.js end else @Feed_items = Micropost.all.paginate(page: params[:page]).per_page(10) respond_to do |format| format.html { render 'static_pages/home' } format.js end end end
[编辑]
应用程序/视图/微柱/ create.js.erb
<% if @micropost.new_record? %> alert("Failed to upload <%=j @micropost.errors.full_messages.join(',').html_safe %>.") <% else %> $('#Feed').prepend('<%= j render(@micropost) %>') <% end %> $('#micropost_form_div').remove(); $('#new-micropost-link').show();
rails服务器日志
Started POST "/microposts" for 130.95.254.26 at 2015-06-09 07:05:02 +0000 Processing by MicropostsController#create as HTML Parameters: {"utf8"=>"✓","authenticity_token"=>"vQQhQEqn3Owt3arYsUTG0u8rrm9AabK7p4xq1N5hCY7SVUU+1oqM82kiEpkys8P+ju4OScp3te15hJOK/yiw5A==","micropost"=>{"picture"=>[#<Actiondispatch::Http::UploadedFile:0x007f5a808e8fc8 @tempfile=#<Tempfile:/home/ubuntu/workspace/sample_app/RackMultipart20150609-8758-26fuon.png>,@original_filename="bitcomet-logo.png",@content_type="image/png",@headers="Content-disposition: form-data; name=\"micropost[picture][]\"; filename=\"bitcomet-logo.png\"\r\nContent-Type: image/png\r\n">],"content"=>""},"commit"=>"Post"} User Load (0.2ms) SELECT "users".* FROM "users" WHERE "users"."id" = ? ORDER BY "users"."name" ASC LIMIT 1 [["id",1]] Unpermitted parameter: picture (0.1ms) begin transaction (0.1ms) rollback transaction
宝石(等)
gem 'carrierwave','0.10.0' gem 'mini_magick','3.8.0' gem 'jquery-rails','4.0.3' gem 'jquery-fileupload-rails'
解决方法
试试这个 ……
<%= form_for @micropost,:html => {:multipart => true} do |f| %> <p> <%= f.file_field :picture,:name => "micropost[picture]" %> </p> <% end %> <script> $(document).ready(function() { var multiple_photos_form = $('#new_file_folder'); multiple_photos_form.fileupload({dataType: 'script' add: function (e,BMP or PNG file"); } } }); }); </script>
希望这会帮助你.