Question

我正在开发一个ASP.NET MVC3应用程序。我正在实现自定义图库，我遇到了很多困难。目标浏览器是IE9，所以我不能使用HTML5 File API。我的所有代码都在@using Html.BeginForm中的强类型Razor视图中，我希望为用户实现功能，以便能够在提交之前添加/删除任意数量的图像。

从我的研究中我了解到在实际保存之前实际上没有办法在IE9中预览图像所以我必须在主窗体之外获取图库的代码。现在我可以将图像上传到服务器但是我需要重新加载页面以显示新的图像，这与我想要实现的完全相反 - 感觉图像只是预览而且唯一的保存是在主表单上提交。

根据我的经验，我知道使用AJAX可以实现这样的事情，但我无法弄清楚如何编写代码。这就是我现在所拥有的，但我不确定我走的是正确的道路：

using(Html.BeginForm("UploadPicture", "Forms", FormMethod.Post, new { enctype = "multipart/form-data" }))
    {
         <span class="document-image-frame">
         <input type="file" name="file" />
         <input type="submit" value="OK" class="blabla" />
         </span>
    }

然后我使用这个脚本试图找到一种方法来获取新上传的图像的路径而不重新加载：

$(document).on('click', '.blabla', function () {
        if (confirm('Do you want to save the image?')) {
            $.ajax({
                url: this.href,
                type: 'POST',
                context: this,
                success: function (result) {
                    $(this).closest('span').remove();
                    $("#ajaxBusy").remove();
                }
            });
        }
        return false;
    })

此脚本最初用于其他目的。我不需要确认，但认为它现在没有伤害。

Answer 1

请参见此处：http://anyfindings.blogspot.com/2013/04/upload-file-in-mvc3-via-ajax.html。我希望这可以帮助你:)）

通过jQuery Ajax从razor视图获取上传图像的路径

1 个答案: