Question

我正在尝试在我的新rails项目中使用https://github.com/blueimp/jQuery-File-Upload/wiki/Rails-setup-for-V5。我想创建一个名为assignments的对象，它们附加了多个文件。

如何为正在上传的文件具有嵌套表单的作业创建表单？

Answer 1

此插件更改输入[type = file]信息表单，当它在其他表单中时，它无效。我解决了这个问题：我改为<div id="form">的外形。我通过jQuery提交表单

$.post(url, $('#form *').serialize(), function(response){...}, 'json')

当然，您必须在提交表单之前以某种方式在服务器端管理上传。

Answer 2

我这样做的方法是在我的主表单之外添加一个单独的表单，仅用于上传文件：

= s3_uploader_form post: void_url, as: "photo_url", id: "photo_upload" do
  = file_field_tag "file", multiple: true

= form_for @model do |f|
  ...
  = f.fields_for :children do |child_fields|
    = file_field_tag :"#{child_id}_file", multiple: true

然后我将fileupload插件的一部分挂钩到两个表单，如下所示：

$("#photo_upload").fileupload
  add: (e, data) ->
    data.submit()

  done: (e, data) ->
    file = data.files[0]

// For each child
$("##{child_id}_file").fileupload
  dropzone: $("##{child_id}_dropzone")
  add: (e, data) ->
    # Upload the file using the external upload form with the proper form action and fields
    $rootPhotoUploadForm.fileupload('add', { files: [file], child_id: child_id })

基本上，我使用jQuery-File-Upload's API从外部上传表单上传文件。

请注意，我在外部上传表单上触发“添加”时包含child_id，以便我知道哪个孩子触发了文件上传。该值在每个回调中的data变量中可用。

我已经抽象了很多，因为有很多特定于应用程序的代码，希望你能从中找到它。

如何以嵌套形式使用jQuery FIle Upload？

2 个答案: