使用 remotipart 插件上传图像时围绕 JS 的 Textarea答案

【问题标题】：Textarea wrapped around JS when uploading images with remotipart plugin使用 remotipart 插件上传图像时围绕 JS 的 Textarea
【发布时间】：2013-10-14 08:47:55
【问题描述】：

我正在使用remotipart 插件进行Ajax 图像上传。最近我将 Rails 版本从 3.1.10 升级到 3.2.13。升级 rails 版本后，我发现 ajax 图片上传不起作用。

我有使用 remotipart 插件提交图像并呈现响应的表单。但是在 rails 升级后我无法呈现响应。在调查这个问题时，我发现响应被 textarea 块包裹，因此没有被渲染。

我提到了一些相关的 stackoverflow 问题以及 remotipart 用户在 github 上报告的问题，但无法找到任何解决此问题的方法。

即： ajax post request responds with an html element when including an attachment with paperclip

Trouble with Paperclip and Ajax with Rails 3.2.8

https://github.com/JangoSteve/remotipart/issues/89

谁能建议我如何解决这个问题或我做错了什么？

感谢和问候，

【问题讨论】：

我得到了这个问题的解决方案。我将我的 remotipart 版本降级到 1.0.5 并解决了问题。

标签： remotipart

【解决方案1】：

您可以在您的 js.erb 回调文件中执行此操作：

<% if remotipart_submitted? %>
   //this will be executed when a file is uploaded
   $("#div").html("<%= escape_javascript( render "form" ).gsub('&quot;', "'") %>");
<% else %>
   $("#div").html("<%= escape_javascript( render "form" ) %>");
<% end %>
   //Here you can put more js code

我使用了一个示例代码，因为您没有发布自己的代码。有了这个，你不需要降级你的 remotipart。在https://github.com/JangoSteve/remotipart/issues/89 找到了这个解决方案。为我工作。

【讨论】：

【解决方案2】：

对我来说，这个问题的唯一解决方案是编写自定义表单提交函数，它发送带有表单数据的 Ajax 请求。这不是最佳解决方案，因为 FormData 仅受新浏览器 (IE10+) 支持。

这是咖啡稿：

formAjaxSubmit = ($form, $url) ->
  $formData = new FormData($form[0])

  $.ajax(
    type: 'POST'
    url: $url
    data: $formData
    dataType: 'JSON'
    processData: false
    contentType: false # this is crucial line for $.ajax to work with formData
    error: (xhr, status, error) ->
      $.fn.process_ajax_error(null, xhr, status, error)
    success: (data, status, xhr) ->
      $.fn.process_ajax_success(null, data, status, xhr)
  )
  return false

参数：

$form - jQuery 表单对象，如 $('#myForm')
$url - 提交网址，通常它应该具有表单动作值 $('#myForm').attr('action')

$.fn.process_ajax_... - 这些是自定义响应处理函数

【讨论】：

【解决方案3】：

希望您找到了解决方案。将data: {type: :script} 放入表单中应该可以正常工作

【讨论】：

【解决方案4】：

这就是最终为我解决问题的方法。也来自这里：https://github.com/JangoSteve/remotipart/issues/89

之前与 gsub 的类似建议是为我生成一些无效的 json/js。下面的这个解决方案奏效了！

<% if remotipart_submitted? %>
 $('.form-wrapper').html("<%= j "#{render('form')}" %>");
<% else %>
 $('.form-wrapper').html("<%= j render('form') %>");
<% end %>

【讨论】：