提交其他表单数据jquery文件上传

时间:2018-04-16 03:10:04

标签: jquery jquery-file-upload form-data

我在$('.drop').attr('data-id')中收到formData时遇到问题:

$('.drop').fileupload({
    dataType: 'json',
    url: base_path + 'parallax/upload',
    autoUpload: false,
    replaceFileInput: false, // interferes w/ dropify
    formData: {
        id: $('.drop').attr('data-id'), // nothing
        stmt: '1', // works
        '{/literal}{$this->security->get_csrf_token_name()}{literal}': '{/literal}{$this->security->get_csrf_hash()}{literal}'
    },
    add: function (d, c) {
        console.log($(this).attr('data-id')); // works
        console.log($('.drop').attr('data-id')); // works
        console.log($('#fileupload').attr('data-id')); // works
        var a = [];
        var b = /\.(gif|jpe?g|png)$/i;
        if (c.originalFiles[0]['name'].length && !b.test(c.originalFiles[0]['name'])) {
            a.push('Not an accepted file type.');
        }
        if (c.originalFiles[0]['size'].toString().length && c.originalFiles[0]['size'] > maxsize) {
            a.push('Filesize is too big; try increasing post_max_size and/or upload_max_filesize.');
        }
        if (a.length > 0) {
            bootbox.alert(a.join(''));
        } else {
            start_time = new Date().getTime();
            c.submit();
        }
    },

根据docs,可以通过以下方式添加其他表单数据:

$('#fileupload').fileupload({
    formData: {example: 'test'}
});

哪个适用于我的csrf令牌以及我手动定义的其他内容,但是我似乎无法获得data-id中输入字段的formData。没有错误发生,但我确实看到我的请求没有id属性发送 - 如果我手动定义它 - 它的工作原理。我也可以在add函数中获取属性。

怎么回事?

1 个答案:

答案 0 :(得分:1)

据我所知,您在初始化$('.drop').attr('data-id')课程时尝试添加fileupload的值。此时,该属性肯定是空的。

尝试使用formaData.id事件在实际上传之前设置fileuploadsubmit,如下所述: https://github.com/blueimp/jQuery-File-Upload/wiki/How-to-submit-additional-form-data#setting-formdata-on-upload-start

$('.drop').bind('fileuploadsubmit', function (e, data) {
    data.formData.id = $('.drop').attr('data-id');       
    //or in your case `this` will work, too:
    //data.formData.id = $(this).attr('data-id');       
});