如何将上传的 excel 文件从 javascript 发送到 MVC 4 中的控制器答案

【问题标题】：How to send uploaded excel files from javascript to the controller in MVC 4如何将上传的 excel 文件从 javascript 发送到 MVC 4 中的控制器
【发布时间】：2013-07-03 14:56:07
【问题描述】：

我有一个文件上传按钮，可以上传多个文件。我想使用 javascript 将这些文件存储到一个文件夹中，并将这些文件详细信息从视图发送到控制器。我正在做 mvc 4 razor 应用程序。我是 MVC 的新手。我知道它可以用 json 和 ajax post 方法来完成。但是不知道怎么用。

 <script type="text/javascript">
       var fileNames = [];
       function handleFileUpload(evt) {
                     evt.stopPropagation();
                     evt.preventDefault();
                     var files = document.getElementById('file1').files;
                     for (var i = 0; files[i]; i++) {
                         fileNames.push(files[i]);
                     }
                  }
            $(function () {
                        $("#btnSubmit").click(function () {
                           $.post("@Url.Action("FileDetails")", { filename: JSON.stringify(fileNames) }, "json");
                      });
                 });
</script>

这是我到目前为止所做的。

【问题讨论】：

标签： javascript ajax asp.net-mvc json file-upload

【解决方案1】：

我使用一个名为Uploadify的jquery插件

HTML：

<input type="file" id="uploadBtn" />

Javascript：

<script type='javascript/text'>
$('#uploadBtn').uploadify({
        'uploader': '/uploadify/uploadify.swf',
        'script': 'URL',
        'cancelImg': '/uploadify/cancel.png',
        'buttonText': 'Upload',
        'auto': true,
        'multi': false,
        'removeCompleted': true,
        'simUploadLimit': 1,
        'scriptData': {  },
        'onAllComplete': function () {
           //finished
        }
    });
</script>

MVC 动作：

public void UploadFile(){
 //Get the file
 HttpPostedFileBase upload = this.Request.Files[0];

 //DO STUFF
}

参数“脚本”的 javascript 方法中的 url 将只是您操作的 url。例如，如果 UploadFile 操作在控制器文件中，那么 url 将是这样的：

/文件/上传文件

您也可以使用 'scriptData' 参数传递额外的数据，然后通过以下方式访问它们

String name = Request["name"];

【讨论】：