javascript - 如何将上传的 excel 文件从 javascript 发送到 MVC 4 中的 Controller

Question

我有一个可以上传多个文件的文件上传按钮。我想使用 javascript 将这些文件存储到一个文件夹中，并将这些文件详细信息从 View 发送到 Controller 。我正在做 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>

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

Answer 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 Action :

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

 //DO STUFF
}

参数“script”的 javascript 方法中的 url 将只是您的操作的 url。例如，如果 UploadFile 操作在 Controller 文件中，那么 url 将是这样的:

/文件/上传文件

您还可以使用“scriptData”参数传递额外数据，然后按以下方式访问它们

String name = Request["name"];