Question

我已经成功地使用Remotipart通过AJAX上传图像了一段时间，但我们最近决定采用Backbone路线，现在因为我的表单是通过JS模板呈现的，所以我不再能够使用：remote =＆gt;生成Iframe传输代码的真实语法。我不想弄清楚如何手动执行此操作。关于如何在使用JS模板时让Remotipart工作的任何想法？

Answer 1

找出解决方案。关于Remotipart的JS如何工作，我有点困惑。经过一番研究，这是我发现的：

Remotipart只需绑定到ajax：aborted：file事件，当jQuery UJS（处理传统的AJAX表单提交）检测到表单中的文件时触发。由于该脚本（以及相关的iFrame传输插件）已包含在页面中，您只需手动添加

data-remote="true"

到您的表单。 jQuery有一个.on（）事件绑定到具有这些属性的表单，所以如果你包含它，将触发Remotipart。

另一个问题是，如果提交此表单，由于缺少CSRF令牌，它仍可能无法上传文件。解决方案是手动添加带有令牌的隐藏输入标记。

这是对我有用的最终标记（我使用带有一点jQuery的.eco模板来获取页面上CSRF元标记的值）：

<form accept-charset="UTF-8" id="image-upload-form" action="/projects/<%= @project.get('id') %>" method="post" enctype="multipart/form-data" data-remote="true">
    <input name="project[cover_photo]" type="file" />
    <input type="hidden" name="<%= $('meta[name="csrf-param"]').attr('content') %>" value="<%= $('meta[name="csrf-token"]').attr('content') %>" />
    <input name="_method" type="hidden" value="put" />
    <button id="add-photo">Save</button>
</form>

希望这会帮助别人避免遇到同样的麻烦！

使用Rails，Backbone，Remotipart上传AJAX图像

1 个答案: