如何在创建post时使用JQuery-File-Upload在一个页面上上传多个图像?

我意识到在创建post以添加多个图像时,没有使用jQuery-File-Upload和Carrierwave或Dragonfly在一个页面上创建能力的解决方案。 我有两个模型一个post有很多图像。 我想在添加后立即上传图片,并在保存全新post之前选择取消它。 我的代码没有工作,所以我没有在这里粘贴,也许有人有例子,这个概念是否完全可行jQuery-File-Upload? 如果没有其他方法可以保存多张照片并保持引导视图? 我找到了很好的例子,这些例子代表了与预期的function相似但是使用Upladify: FormFly或仅使用Carrierwave和nested_form: carrierwave-nested_form 。 关于jQuery-File-Upload git wiki是如何在Rails中仅使用一个模型的教程。

我想得到这样的东西: 在此处输入图像描述

所有这一切的主要问题是“如何创建与不存在的对象的关联?”的问题。 。 好吧,你不能。 你能做的就是下一个最好的事情,超越它。 我将通过3个简单的步骤向您展示如何做到这一点。 我故意不发布任何代码,因为该过程本身应该相当清楚,并且适用于各种方法(不仅限于jQuery-File-Upload和Carrierwave或Dragonfly)。

步骤1

将关系的每个部分设置为正常,独立。 使用脚手架(或其他)生成新post。 在post表格的正下方,正常实施照片上传解决方案。 我会像往常一样使用每个对象自己的控制器和部分,以防止这些东西不可磨灭地混合在一起。 暂时不要担心关系关联代码。

第2步

将您的关系代码添加到模型中。 不要担心接口没有正确关联它们。

第3步 (有趣的部分)

现在,将它们捆绑在一起。 我们正在创建图像,但它们不属于任何post。 我们还创建了没有任何图像的post。 我们需要一些方法来完成这种关联。 解决方案非常简单。 您需要在posts表单中创建一个隐藏文本字段,以包含要与post关联的图像的ID。 然后,您的图像创建响应,在将新图像添加到页面的同时将新图像的ID添加到文本字段。 类似地,在post控制器中,只需在隐藏字段中循环ID并在保存之前关联目标对象。 您可能希望向取消按钮添加类似的逻辑,例如从页面中删除图像时从arrays中删除ID。 您可能还希望添加计划任务以清除与post无关的特定年龄的图像,以从已放弃的表单中删除任何混乱。

我发现了一个小例子,用带有载波的rails中的JqueryFileUpload上传多个图像。

我目前正致力于使用JqueryFileUpload更好地解决多文件上传问题,但这个主题并不容易。

在这个例子中

当您在pictures_controller新操作中设置新post对象的实例时,可以使用body:string生成post脚手架,您可以在图片/新视图中为post实现表单。

 <%= form_for(@post) do |f| %> 
<%= f.label :body %>
<%= f.text_field :body %>
<%= f.submit %>
<% end %>