Rails 3和一个嵌套的jQuery文件上传模型 [英] Rails 3 and a Nested jQuery File Upload Model

问题描述

$ b

我的模型has_many附件并接受必要的嵌套属性。我想得到这个与jQuery文件上传工作，但一直没有找到任何好的例子，让我开始。

有没有人取得了这样的能够给一些方向吗？

谢谢。

解决方案

当编辑带嵌套附件的模型时，它已经成功地开始工作了。
创建新模型时不可能做到这一点 - 至少目前不是由于回形针。

你必须设置一些jQuery文件上传选项，我发现这里。
$ b 您应该在整个表单上调用 fileUploadUI（），并设置文件输入包装器元素作为 dropZone 。您也应相应地设置 url ， fieldName 和 formData 。

下面是我的JS看起来像（简化）：

$ $ $ $ $ $ $ $ file_upload_form = $（form）
var attachchable_id = $ file_upload_form.attr（id）。match（/ _（\ d *）$ /）[1]
var attachable_type = $ file_upload_form.attr（id）。match（/ edit_（\w *）_ \ d * $ /）[1]
$ b $（$ file_upload_form）.fileUploadUI（{
url：'/ admin / attachments'，
fieldName：attachment [data]，
formData：[
{
name：'attachment [attachable_id]'，
value：attachable_id
}，
{
name：'attachment [attachable_type]'，
value：attachable_type
}
]，
dropZone：$（'＃attachments_dropzone'），
uploadTable：$（'＃upload_files'），
downloadTable：$（'＃download_files'），
buildUploadRow：function（files，index）{
var file = files [index];
return $（'< tr>< td>'+ file.name +'< \ / td>'+
'< td class =file_upload_progress>< div> ;< \ / div>< \ / td>'+
'< td class =file_upload_cancel>'+
'< button class =ui-state-default ui-corner-alltitle =取消>'+
'< span class =ui-icon ui-icon-cancel>取消< \ / span>'+
'< \ /按钮>< \ / TD>< \ / TR>'）;
}，
buildDownloadRow：function（file）{
return $（'< tr>< td>< img alt =Photowidth =40height =40 src ='+ file.pic_path +'>'+ file.name +'< \ / td>< \ / tr>'）;
}
}）

Does anyone have advice/examples on getting the jQuery File Upload plugin working with Rails using nested attributes?

My model "has_many" attachments and accept the necessary nested attributes. I would like to get this working with the jQuery File Upload but haven't been able to find any good examples to get me started.

Has anyone achieved something like this and able to give some direction?

Thanks.

解决方案

I've succesfuly set it up to work when editing a model with nested attachments.
The same is not possible when creating a new model - at least not currently due to paperclip.

You have to set up some jQuery File Upload options which I found here.

You should call fileUploadUI() on the whole form, and set file input wrapper element as dropZone. You should also set url, fieldName and formData accordingly.

Here's how my JS looks like (simplified):

var $file_upload_form = $("form")
var attachable_id     = $file_upload_form.attr("id").match(/_(\d*)$/)[1]
var attachable_type   = $file_upload_form.attr("id").match(/edit_(\w*)_\d*$/)[1]

$($file_upload_form).fileUploadUI({
    url         : '/admin/attachments',
    fieldName   : "attachment[data]",
    formData    : [
        {
            name  : 'attachment[attachable_id]',
            value : attachable_id
        },
        {
            name  : 'attachment[attachable_type]',
            value : attachable_type
        }
    ],
    dropZone        : $('#attachments_dropzone'),
    uploadTable     : $('#upload_files'),
    downloadTable   : $('#download_files'),
    buildUploadRow  : function (files, index) {
        var file = files[index];
        return $('<tr><td>' + file.name + '<\/td>' +
                        '<td class="file_upload_progress"><div><\/div><\/td>' +
                        '<td class="file_upload_cancel">' +
                        '<button class="ui-state-default ui-corner-all" title="Cancel">' +
                        '<span class="ui-icon ui-icon-cancel">Cancel<\/span>' +
                        '<\/button><\/td><\/tr>');
    },
    buildDownloadRow: function (file) {
        return $('<tr><td><img alt="Photo" width="40" height="40" src="' + file.pic_path + '">' + file.name + '<\/td><\/tr>');
    }
})

这篇关于Rails 3和一个嵌套的jQuery文件上传模型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！