在父级的新视图/表单中创建关联记录。关联记录通过ajax/jquery-file-upload完成

Question

所以我有一个“样式”模型，它有_许多“图像”。在新样式页面中，我希望能够在同一页面中添加所有图像。但是，由于我们还没有创建样式记录，所以它没有 ID。那么我将如何收集所有由 ajax 构建/上传的图像，并在保存新样式后更新它们的 style_id 属性？

我正在使用 jquery-file-upload 将图像添加到 Image 表，并将我的文件上传到 Rackspace 云文件。所有这些都有效，除了手动设置之外，我无法设置 style_id。

是否有最佳实践/正确的方法来解决这个问题，因为 jquery-file-upload 使用 Ajax，我不确定保存我父母的最佳方法。我认为最好的方法是使用 ajax 来提交父表单，而不是使用 dom，比如向父表单添加隐藏的输入/元素？

谢谢

样式：部分形式

<%= form_for @style, :html => {:multipart => true} do |f| %>
    //NORMAL RAILS FORM CODE HERE
<% end %>

<%= form_for Image.new, :html => { :multipart => true, :id => "fileupload"  } do |f| %>
  <%= f.file_field :file, :multiple => true %>
<% end %>

<script>
$(function () {
  $('#fileupload').fileupload({
    dataType: 'json',
    url: '<%= style_images_path(1) %>',
    add: function (e, data) {
        data.context = $('<div class="img uploading"/>').text('Uploading...').appendTo(document.body);
        data.submit();
    },
    done: function (e, data) {
        $.each(data.result.files, function (index, file) {
            $('<img src="'+file.thumbnail_url+'">').appendTo(data.context);
        });
        console.log(data);
        data.context.append("<span>done</span>");
    },
    option: {
            autoUpload: true,
    }
  });
});
</script>

在上面的代码中你可以看到我手动设置了style_id... style_images_path(1)

-

我提出的解决方案：

我的想法是将所有子项（图像）的 id 数组传递给样式的创建/更新方法。并在控制器中，将匹配 id 的所有 style_id 属性更新为新创建的样式的 id...我认为这可能吗？

Answer 1

这很棘手。

您可以在控制器的new 方法中实例化@style。 而不是：

@style = Style.new

放

@style = Style.create

如果验证出现问题，请使用以下解决方法：

@style = Style.new
@style.save :validate => false

现在在您看来，您有一个完全合格的@style，其 ID 可以传递给 js：

    url: '<%= style_images_path(@style) %>',

此时（如果有的话）用户单击表单按钮时，控件到达update 方法，而不是create（这是因为_form.html.erb 自动将HTTP 动词从POST（创建) 到 PUT（更新）。因此请确保您的控制器已为此做好准备）。

您还应该考虑某种“垃圾收集”，以防 Style 对象被创建但从未保存。这可能不是直截了当的，因为用户总是可以关闭窗口，而您在数据库中留下的样式不完整。也许一些 js 函数会在窗口关闭时触发并调用 garbage_collect_if_not_saved(@style) 方法？仍然不完美（如果浏览器挂起怎么办？）但总比没有好。否则，一个旧的基于 cron 的脚本可以清理数据库。

干杯，