如何使用 JQuery 将文件发送到 Action?

How To Send File To Action With JQuery?

我想将 txt 文件发送到 action 并在不提交表单的情况下获取文本字数。

我的代码运行良好(此操作获取 HttpPostedFileBase 并与流一起使用 reader return 计数)所以问题出在视图中。

这是我在视图中的代码,用于发送文件以查看并获取结果:

<script>

    $("#MyForm").submit(function (event) {
        event.preventDefault();

        var files = $('#fileInput').files[0]);

        $.ajax({
            type: "Post",
            url: "/Counter/GetCount",
            enctype: "multipart/form-data",
            data: files
        }).done(function (result) {

            $("#result").html(result);

        });
</script>

如果可以的话,请修复我的代码或给我新代码我想看看你对此的建议。

编辑 来自评论的代码:

[HttpPost] 
public ActionResult GetCount(HttpPostedFileBase file) 
{ 
  using (StreamReader reader = new StreamReader(file.FileName)) 
  { 
    string result = reader.ReadToEnd(); 
    return PartialView(result.Count()); 
  } 
}

您可以尝试将 ajax 请求代码替换为:

$.ajax({
  url: "/Counter/GetCount",
  data:files,
  type:'POST',
  contentType: false,
  processData: false,
  success: function(result){
    $("#result").html(result);
  }
});

您可以尝试使用 FormData 将文件传递给操作 ajax.Here 是一个有效的演示:

查看:

<form id="MyForm" method="post">
    <input id="fileInput" type="file" />
    <input type="submit" value="submit"/>
</form>
<script>
        $("#MyForm").submit(function (event) {
            event.preventDefault();
            var formData = new FormData();
            formData.append('file', $('#fileInput').get(0).files[0]);
            $.ajax({
                type: "Post",
                url: "/Counter/GetCount",
                data: formData,
                processData: false,
                contentType: false,
            }).done(function (result) {

                $("#result").html(result);

            });
        })
    </script>

操作:

[HttpPost] 
public ActionResult GetCount(IFormFile file) 
{ 
  using (StreamReader reader = new StreamReader(file.FileName)) 
  { 
    string result = reader.ReadToEnd(); 
    return PartialView(result.Count()); 
  } 
}

结果: