FineUploader OnComplete 方法未触发

Question

所以，我在 MVC 4 应用程序中使用 FineUploader 3.3，这是一个非常酷的插件，物有所值。现在，我只需要让它正常工作。

我对 MVC 很陌生，对传回 JSON 也很陌生，所以我需要一些帮助才能让它工作。这是我正在使用的，都在 doc.ready 内。

var manualuploader = $('#files-upload').fineUploader({
request:
{
    endpoint: '@Url.Action("UploadFile", "Survey")',
    customHeaders: { Accept: 'application/json' },
    params: {
        //variables are populated outside of this code snippet
        surveyInstanceId: (function () { return instance; }),
        surveyItemResultId: (function () { return surveyItemResultId; }),
        itemId: (function () { return itemId; }),
        imageLoopCounter: (function () { return counter++; })
    },
    validation: {
        allowedExtensions: ['jpeg', 'jpg', 'gif', 'png', 'bmp']
    },
    multiple: true,
    text: {
        uploadButton: '<i class="icon-plus icon-white"></i>Drop or Select Files'
    },                              
    callbacks: {
        onComplete: function(id, fileName, responseJSON) {
            alert("Success: " + responseJSON.success);
            if (responseJSON.success) {
                $('#files-upload').append('<img src="img/success.jpg" alt="' + fileName + '">');
                }
            }
    }
}

编辑：我一直在使用 Internet Explorer 9，然后切换到 Chrome、Firefox，我可以正常上传。 IE9 需要什么？无论浏览器如何，验证都不起作用。

端点触发，并填充文件/参数，所以这一切都很好！验证不会阻止用户选择此列表之外的内容，但我暂时可以使用它。我可以成功保存并做我需要做的上传，减去触发OnComplete。实际上，在 IE 中，我会看到一个 OPEN/SAVE 对话框，其中包含我目前拥有的内容。

问题：onComplete（id、filename、responseJSON）中的函数参数是通过返回填充还是在输出填充？我只是对此感到困惑。我的 JSON 是否必须在其中包含这些参数并填充？

我不这样做（填充那些参数），我在 C# 中的输出方法返回 JsonResult 看起来像这样，只是返回“成功”（如果合适的话）：

return Json(new { success = true });  

我需要添加更多吗？这条线是在保存之后，我想做的就是告诉用户一切都好还是不好。我的 JSON 中的 success 属性是否与 responseJSON.success 匹配？

我遗漏了什么，或者有什么问题？

Answer 1

解决您问题中的项目：

1. 关于“选择文件”对话框内的限制，您还必须设置acceptFiles 验证选项。有关详细信息，请参阅validation option section in the readme。
2. 您的validation 选项属性在错误的位置。它不应该在request 属性/选项下。您的text、multiple 和callbacks 选项/属性也是如此。此外，您没有为 jQuery 插件正确设置回调。
3. IE 中的打开/保存对话框是由于您的服务器未返回具有正确“Content-Type”标头的响应而导致的。您的回复的 Content-Type 应该是“text/plain”。有关详细信息，请参阅server-side readme。
4. 在处理响应客户端时，Fine Uploader 将使用 JSON.parse 解析服务器在其响应中返回的任何内容。在服务器响应上调用JSON.parse 的结果将作为responseJSON 参数传递给onComplete 回调处理程序。如果您想将特定信息从您的服务器传递到您的客户端代码，例如您可能希望在客户端显示的一些文本、上传文件的新名称等，您可以通过向您的服务器响应。然后，这些数据将在您的 onComplete 处理程序中提供给您。如果您对此没有任何需求，您可以简单地返回您当前返回的“成功”响应。我链接到的服务器端自述文件提供了有关所有这些的更多信息。

为了澄清我在 #2 中所说的内容，您的代码应如下所示：

$('#files-upload').fineUploader({
   request: {
       endpoint: '@Url.Action("UploadFile", "Survey")',
       customHeaders: { Accept: 'application/json' },
       params: {
           //variables are populated outside of this code snippet
           surveyInstanceId: (function () { return instance; }),
           surveyItemResultId: (function () { return surveyItemResultId; }),
           itemId: (function () { return itemId; }),
           imageLoopCounter: (function () { return counter++; })
       }
   },
   validation: {
       allowedExtensions: ['jpeg', 'jpg', 'gif', 'png', 'bmp']
   },
   text: {
       uploadButton: '<i class="icon-plus icon-white"></i>Drop or Select Files'
   }
})
   .on('complete', function(event, id, fileName, responseJSON) {
       alert("Success: " + responseJSON.success);
       if (responseJSON.success) {
          $('#files-upload').append('<img src="img/success.jpg" alt="' + fileName + '">');
       }
   });