Rails 3图像上传表单使用http而不是AJAX提交答案

【问题标题】：Rails 3 Image upload form submitting with http instead of AJAXRails 3图像上传表单使用http而不是AJAX提交
【发布时间】：2013-05-08 08:55:03
【问题描述】：

我正在制作一个通过 AJAX 而不是 http 提交的表单。这是表格：

    <%= form_for(:image, :remote => true, :url => {:controller=> 'questions',:action => 'upload'},:multipart => true) do |f| %>

    <%= f.file_field :image, :onchange => "$(this).parents('form').submit();"  %>

    <% end %>

我已经在上面设置了:remote => true 选项并提交了带有onchange 事件的表单。我在控制器中有以下代码：

def upload

     if request.xhr?
        @image = Image.new(params[:image])
        @image.save

            respond_to do |format|
                format.js { render :layout=>false }
           end
     else
           render :text => 'Request Wasnt AJAX'
     end
end

我的操作每次都呈现文本，尽管设置了远程标记，但请求似乎不是 AJAX 样式（即使在最终的 HTML 中也正确显示）。我不知道我哪里出了问题。我已经在 FF 和 Chrome 的最新浏览器版本中对其进行了测试，所以我认为这不是浏览器问题。有什么想法吗？

更新：我做了更多的调试尝试。问题在于文件字段，如果我用文本字段替换文件字段，则请求是 AJAX（其他一切都保持不变）。但是对于一个文件字段，它总是发送一个非 AJAX 请求。

注意：总体目标是通过 AJAX 请求上传图像，响应不呈现任何内容，不呈现 HTML，不重定向，不重新加载页面。

【问题讨论】：

您的 application.js 或其他包含的 JS 文件中是否同时包含 //= require jquery 和 //= require jquery_ujs？
嘿，是的。我做了一些更多的测试。问题在于文件字段，如果我用文本字段替换文件字段，则请求是 AJAX（其他一切都保持不变）。但是对于一个文件字段，它总是发送一个非 AJAX 请求。

标签： ajax ruby-on-rails-3 html jquery

【解决方案1】：

通过安装 Remotipart gem 让它工作。要上传图片文件，使用ajax表单提交，这是唯一的办法。在这里找到 git：https://github.com/JangoSteve/remotipart

【讨论】：

【解决方案2】：

JQuery form.sumbit() 以正常方式提交表单（不是 Ajax）。你必须采取不同的方式：

$('#submitButton').click( function() {
    $.ajax({
        url: 'some-url',
        type: 'post',
        dataType: 'json',
        data: $('#myForm').serialize(),
        success: function(data) {
              // ... do something with the data...
        }
    });
});

【讨论】：

当 :remote => true 设置在 rails 时不会。请阅读更新。当表单字段是 text 时，它工作正常，专门针对 image 失败。如果不使用插件，通过上面的 ajax 函数上传图片也很复杂。