删除不在表单中的文件,但在模型中

时间:2015-02-11 17:08:30

标签: asp.net-mvc razor asp.net-mvc-5

我正在显示来自〜/ Content / Files的上传文件列表,并为用户提供上传选项。我正在尝试在每个文件旁边放置一个删除按钮,并允许它“无缝”删除,并将其从页面中删除。我不确定我在页面上是否有表格并且我在帖子中没有使用该表格的事实也导致我混淆。

除了无缝删除的部分,这就是我所拥有的:

视图

@model IEnumerable<string>

<h2>Files</h2>

<ul>
    @foreach (var fName in Model)
    {
        var name = fName;
        var link = @Url.Content("~/Content/Files/") + name.Replace(" ", "%20");

        <li style="margin: 10px;">
            <a href="@link">@name</a> | <input type="button" value="Delete" class="btn btn-danger" onclick="location.href = '@Url.Action("DeleteFile", "Home", new { fileName = name })'">
        </li>
    }
</ul>

<div>
    @using (Html.BeginForm("Files", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
    {
        <input type="File" name="file" id="file" value="Choose File" />
        <button type="submit">Upload</button>
    }
</div>

控制器

[HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult DeleteFile(string fileName)
    {

        string file = fileName;
        string fullPath = Request.MapPath("~/Content/Images/" + file);
        if (System.IO.File.Exists(fullPath))
        {
            System.IO.File.Delete(fullPath);
        }
        return RedirectToAction("Files");
    }

如果你想知道,这是Files Action方法:

public ActionResult Files()
        {
            var path = Server.MapPath("~/Content/Files/");

            var dir = new DirectoryInfo(path);

            var files = dir.EnumerateFiles().Select(f => f.Name);

            return View(files);
        }

它一直试图将我路由到http://localhost:51123/Home/DeleteFile?fileName=test.docx(我理解这是因为按钮onclick方法),当我想要做的就是执行Delete方法然后重新加载View。 / p>

我确信我在几个不同的地方出错了。

2 个答案:

答案 0 :(得分:1)

您要将此请求作为GET请求发送,并且您的控制器中的操作方法具有装饰该方法的[HTTPPost]属性。这只允许POST请求进入此操作方法。你有几个选择。您可以将请求更改为POST请求,请求将在控制器中成功找到正确的操作方法。另一个选择是删除控制器中装饰操作方法的HTTPPost属性。

就个人而言,我建议将请求更改为Http DELETE动词(因为这是请求的预期操作),然后使用HTTPDelete属性修饰您的方法。

<强>更新

要以HTTP DELETE的身份提交此请求,您可以通过更改onclick事件的内容来执行以下操作:

<li style="margin: 10px;">
            <a href="@link">@name</a> | <input type="button" value="Delete" class="btn btn-danger" onclick="DeleteRecord(name)">
        </li>

在你的javascript中,你将拥有这样的功能:

function DeleteRecord(name) {

$.ajax({
   url: '@Url.Action("DeleteFile", "Home")',
   data: name
   type: 'DELETE',
   success: function(response) {
     //...
   }
});
}

我之所以通过jQuery的ajax函数这样做是因为HTML表单(最高为HTML版本4和XHTML 1)仅支持GET和POST作为HTTP请求方法。解决方法是使用隐藏的表单字段通过POST隧道传输其他方法,该字段由服务器读取并相应地调度请求。

然而,GET,POST,PUT和DELETE在所有主要的Web浏览器(IE,Firefox,Opera,Chrome,Safari)中都支持XMLHttpRequest(即AJAX调用)的实现。

干杯!

答案 1 :(得分:-1)

您的文件操作是从内容/文件中获取文件。您的删除操作正在尝试删除内容/图像中的文件。您需要在两个操作中使用相同的文件夹才能显示更改。