jquery - 使用 MVC 4 和 Ajax 上传文件-6ren

jquery - 使用 MVC 4 和 Ajax 上传文件

转载作者：行者123 更新时间：2023-11-28 06:06:53

25

4

我正在使用 MVC 4 + VS 2012 + Framework 4.5 开发 Web 应用程序。

我的索引页面上有三个局部 View ，它们根据用户操作动态呈现。

在三个部分 View 中，一个部分 View 具有上传文件功能以及一些输入字段(例如文本框)。

问题:

当用户单击“保存”按钮(该按钮出现在局部 View 本身上)时。我想将输入字段保存到我的数据库中并将上传的文件存储在共享文件夹中。

我想使用 Ajax 来实现这一点(上传文件并保存数据后，用户应该位于同一 View 上)。

我怎样才能实现同样的功能？ JQuery 解决方案就可以了。

我尝试过使用@Ajax.BeginForm，但上传文件后，会发生完整的回发。

最佳答案

这是我的小型工作示例，它上传多个文件并上传到名为“垃圾”的文件夹中

客户端......

    <html>
    <head>
    <title>Upload Example</title>
    <script src="~/Scripts/jquery-2.1.0.intellisense.js"></script>
    <script src="~/Scripts/jquery-2.1.0.js"></script>
    <script src="~/Scripts/jquery-2.1.0.min.js"></script>
    <script>
    $(document).ready(function () {
        $("#Upload").click(function () {
            var formData = new FormData();
            var totalFiles = document.getElementById("FileUpload").files.length;
            for (var i = 0; i < totalFiles; i++)
            {
                var file = document.getElementById("FileUpload").files[i];

                formData.append("FileUpload", file);
            }
            $.ajax({
                type: "POST",
                url: '/Home/Upload',
                data: formData,
                dataType: 'json',
                contentType: false,
                processData: false,
                success: function (response) {
                    alert('succes!!');
                },
                error: function (error) {
                    alert("errror");
                }
            });
        });
    });

</script>
</head>
<body>
    <input type="file" id="FileUpload" multiple />
    <input type="button" id="Upload" value="Upload" />
</body>
</html>

服务器端......

public class HomeController : Controller
{
    [HttpPost]
    public void Upload( )
    {
        for( int i = 0 ; i < Request.Files.Count ; i++ )
        {
            var file = Request.Files[i];

            var fileName = Path.GetFileName( file.FileName );

            var path = Path.Combine( Server.MapPath( "~/Junk/" ) , fileName );
            file.SaveAs( path );    
        }

    }
}

关于jquery - 使用 MVC 4 和 Ajax 上传文件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36770251/

25

4

0

文章推荐： ios - 根据星期几显示不同的消息

文章推荐： c++ - Arduino循环/设置问题

文章推荐： arrays - 如何从函数返回多个值并将其分配给数组？

文章推荐： c++ - 类变体类型 : Why a vtable?

javascript - 正则表达式/[a-zA-Z0-9_-]/传 `!!!`时返回true
我有以下正则表达式 /[a-zA-Z0-9_-]/ 当字符串只包含从 a 到z 大小写、数字、_ 和 -。我的代码有什么问题？能否请您向我提供一个简短的解释和有关如何修复它的代码示例？ //var

首页

博学

6Ren·AI

商城

jquery - 使用 MVC 4 和 Ajax 上传文件