【问题标题】:Posting form located in partial view位于局部视图中的过帐表单
【发布时间】:2014-02-09 19:27:43
【问题描述】:

我是 MVC 4 和剃须刀的新手,我的布局视图包含位于部分视图中的表单,

我的模特:

public class SubscribeModel
{
    [Required(ErrorMessage = "Veuillez saisir votre adresse mail pour s'inscrire ...")]
    [EmailAddress(ErrorMessage = "Vous devez saisir une adresse mail valide \"Ex: mail@domaine.com\"")]
    public string SubEmail { get; set; }
}

布局视图呈现部分视图“_subscribe”,其中包含要注册到时事通讯的表单:

<body>
    <div id="container">
        <header>
            <div id="banner">
                @Html.Partial("~/Views/Soscom/_Subscribe.cshtml")
            </div>
        ....
</body>

我的部分观点“_Subscribe”:

@model SoscomAppMvc.Models.SubscribeModel

@using (Html.BeginForm("Subscribe", "Soscom"))
{
    @Html.TextBoxFor(m => m.SubEmail, new { placeholder = "Email pour s'inscrire à la newsletter", @class = "subscribebox", maxlength = "70" })
    @Html.ValidationMessageFor(m => m.SubEmail)
    <input class="subscribeBtn" type="submit" value="s'inscrire">
}

我使用 HttpGet Action 方法将模型发送到局部视图“_subscribe”:

    [HttpGet]
    public PartialViewResult Subscribe()
    {   
        return PartialView("_Subscribe", new SubscribeModel());
    }

但是当我使用下面的 HttpPost Action 时,我得到了一个没有布局页面的局部视图?

    [HttpPost]
    public ActionResult Subscribe(SubscribeModel subscribe)
    {
        if (!ModelState.IsValid) 
            return PartialView("_Subscribe", subscribe);
        return View(subscribe);
    }

问题:

有没有办法在当前视图中包含 Post 响应?

【问题讨论】:

  • 我认为 templated helpers 可能会对您有所帮助。看看这个链接 - Templated Helpers。希望你能有所了解。

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


【解决方案1】:

Partials 只是在多个视图中重用一些 HTML 的一种方式。一旦页面被发送给用户并在他们的浏览器中呈现,您在页面上有一个或多个部分的事实并不重要。如果你做一个传统的 POST,它会改变整个页面,因为事情就是这样工作的。

我认为您想要实现的是发布 POST 并仅更改页面的 部分,而不提示重新加载整个页面。这需要 AJAX。您需要使用 JavaScript 捕获并处理表单的提交事件,发出 POST 请求,使用 AJAX 使用序列化的表单数据,最后在成功时将某些 DOM 节点的内容替换为返回的 HTML。

【讨论】:

  • 谢谢你的回复,这是我需要了解的,但是我不知道怎么用ajax。所以我会寻找另一种解决方案,我考虑使用部分视图的原因是我的布局视图中有几个表单,我现在的问题是如何操作它的表单以及如何发送每个表单的适当模型他们?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-06-22
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-07-04
相关资源
最近更新 更多