Question

我有一个Ajax.ActionLink的部分视图，点击后应该将视图（目标DIV）替换为允许用户上传图像的另一个部分视图。我在页面上有几个这样的工作，我似乎无法弄清楚为什么我会为这个特定的一个获得404。

这就是我所拥有的：

MyProfile.cshtml包含所有部分（租户参考照片是更新目标DIV）：

<div class="row-fluid">
    <div class="span6 well-border" id="tenant-reference-photos">
        @Html.Partial("~/Views/Tenants/_TenantReferencePhotosPartial.cshtml", Model)
    </div>
    <div class="span6 well-border" id="tenant-viewings">
        @Html.Partial("~/Views/Tenants/_TenantViewingsPartial.cshtml", Model)
    </div>
</div>

_TenantReferencePhotosPartial.cshtml（ActionLink在这里给出404）：

<div class="row-fluid">
@if (Model.ReferencePhotos == null)
{
    <h3>You haven't uploaded any references! 
    @Ajax.ActionLink("Upload now?", // on click 404 returned in developer tools in Chrome
        "UploadReference",
        new AjaxOptions
        {
            UpdateTargetId = "tenant-reference-photos",
            InsertionMode = InsertionMode.Replace,
            HttpMethod = "GET",
            LoadingElementId = "ajax-loader"
        })
    </h3>
}
</div>

以下代码返回上述部分：

[HttpGet]
public ActionResult TenantReferencePhotos()
{
    var currentTenant = tenantRepository.GetLoggedInTenant();
    return PartialView("_TenantReferencePhotosPartial", currentTenant.ReferencePhotos.ToList());
}

以下ActionResult是Ajax.ActionLink中未调用的内容，并给出了404错误：

[HttpPost]
public ActionResult UploadReference(HttpPostedFileBase file, Tenant tenant)
{
    if (file != null)
    {
        if (file.ContentLength > 10240)
        {
            ModelState.AddModelError("file", "The size of the file should not exceed 10 KB");
            return View();
        }

        var supportedTypes = new[] { "jpg", "jpeg", "png", "JPG", "JPEG", "PNG" };
        var fileExt = System.IO.Path.GetExtension(file.FileName).Substring(1);

        if (!supportedTypes.Contains(fileExt))
        {
            ModelState.AddModelError("photo", "Invalid type. Only the following types (jpg, jpeg, png) are supported.");
            return View();
        }

        using (var db = new LetLordContext())
        {
            var reference = db.Image.Create<ReferencePhoto>();

            // Convert HttpPostedFileBase to byte array
            MemoryStream target = new MemoryStream();
            file.InputStream.CopyTo(target);
            byte[] photo = target.ToArray();

            reference.File = photo;
            reference.Format = fileExt;
            reference.DateUploaded = DateTime.Now.Date;
            reference.Description = "";
            reference.Name = "";

            db.Image.Add(reference);
            db.SaveChanges();

            return PartialView("_TenantReferencePhotosPartial", file);
        }
    }
    else
    {
        return View();
    }
}

为了完整性，这里是可以上传图像的局部视图：

<div>
@using (Ajax.BeginForm("UploadReference", "Tenants", FormMethod.Post,
   new AjaxOptions
   {
       InsertionMode = InsertionMode.Replace,
       HttpMethod = "POST",
       UpdateTargetId = "tenant-reference-photos"
   }))
{
    @Html.ValidationSummary(true)
    @Html.AntiForgeryToken()
    <div>
        Select a file:
        <input type="file" name="file" />
        <input type="submit" value="UploadReference" />
    </div>
}
</div>

引用了MyProfile.cshtml中的所有脚本。 unobtrusive-ajax.js是否需要作为脚本包含在所有部分视图中，即使它在Layout.cshtml和/或MyProfile.cshmtml中被引用？

有人能说出我为什么会收到上述错误吗？

Answer 1

在您的代码UploadReference中装饰有HttpPost属性，因此只有在您进行POST时才能访问它。在您的视图中，您已将HttpMethod配置为GET。当您将其更改为POST时，它应该有效：

@Ajax.ActionLink("Upload now?",
    "UploadReference",
    new AjaxOptions
    {
        UpdateTargetId = "tenant-reference-photos",
        InsertionMode = InsertionMode.Replace,
        HttpMethod = "POST",
        LoadingElementId = "ajax-loader"
    })

Ajax.ActionLink给出404未找到错误

1 个答案: