使用PlUpload上传后通过ajax发布文件信息

时间:2011-10-29 17:02:04

标签: asp.net-mvc-3 jquery plupload

我正在使用plupload的自定义示例,其中

  • 首先将一个或多个文件上传到Amazon S3存储桶,
  • 然后文件信息+用户输入的数据(例如描述)被POST 通过ajax到我的控制器动作循环。

然后,此控制器操作将验证文件是否已上载到S3存储桶,然后将信息保存到数据库中,并将成功或失败返回到ajax调用。

我使用'UploadComplete'事件来检查是否存在任何上传错误,如果没有,则在循环中执行实际的POST。

我想做的是等到整个循环完成处理,然后相应地显示确认消息(所有成功,全部失败,混合两者)。

当前代码:

uploader.bind('UploadComplete', function (up, files) {

        var errorsPresent = false;
        var errors = '';
        // re-enable buttons
        $('div.plupload_buttons a').removeClass('disabled');
        $.each(uploader.files, function (i, file) {
            if (errorDescArray.hasOwnProperty(file.id)) {
                errorsPresent = true;
                errors += errorDescArray[file.id] + '<br />';
            }
            else if (file.status = plupload.DONE) {
                var jqXhr = $.post('/documents/add', {
                    '__RequestVerificationToken': $('#__AjaxAntiForgeryForm input[name=__RequestVerificationToken]').val(),
                    'filename': file.name,
                    'size': file.size,
                    'location': $('#' + file.id + '_location').val(),
                    'description': $('#filedesc_text_' + file.id).text()
                }).error(function (response) {
                    errorsPresent = true;
                    errors += response.responseText + '<br />';
                });
            }
        });
        //
        if (errorsPresent) {
            $('#uploadErrors').html('<div data-alert="alert" class="alert-message block-message fade in error"><a href="javascript:void(0)" class=\"close\">×</a><p>' + errors + '</p></div>');
        }
        else {
            // set confirmation message
            var message = files.length + ' file(s) were successfully uploaded.';
            // clear file list
            $('ul.plupload_filelist').html('');
            // remove files from list
            uploader.splice();
            // hide modal
            $('#upload-modal').modal('hide');
            // show confirmation
            $('#flashMessage').html('<div data-alert="alert" class="alert-message block-message fade in success"><a href="javascript:void(0)" class=\"close\">×</a><p>' + message + '</p></div>');
        }
    });

以上显然存在缺陷,因为该片段的后半部分并不真正等待POST完成,结果即使POST有错误响应也会显示成功确认。

所以我的问题是:如何在循环中执行ajax帖子(除非有更好的方法)并在循环完成处理后处理确认消息?

0 个答案:

没有答案