Question

我试图找出使用MVC创建可重用表单的最佳方法。情况是我有一些表格用于编辑在网站上的几个地方使用的数据组，所以显然我不想复制粘贴这些地方的每个地方的相同表格。我试图使用局部视图，但我不能完全使用它，也许我在这里走错了路。

显示我的问题的情况是我有一个带有三个不同选项卡的视图（所有选项卡都在同一视图中并使用简单的javascript）。在每个选项卡上，我添加了一个部分视图，用于编辑特定数据。我用控制器和一切创建了部分视图。每个局部视图都包含自己的表单和验证摘要。

如果我的控制器操作只返回一个PartialView，结果是部分视图被单独渲染，而没有围绕它的父视图。如果我得到那个结果，我在这里做错了吗？

我是否在错误的轨道上这样做？我应该做一些其他的解决方案吗？

更具体地说明我的问题：

1）是否存在用于实现包含表格的组件的通用模式/解决方案？
2）在这里使用部分视图的解决方案，如何在主视图中呈现控制器动作的结果，以及在帖子之前呈现的方式？

主视图的部分代码：

<div class="tab-content no-border padding-24">
    <div id="editProfile" class="tab-pane in active">
    @{
        Html.RenderAction("EditUserProfile", "UserData", new { userId = Model.Id });
    }
    </div>
    <div id="password" class="tab-pane">
    @{
        Html.RenderAction("EditPassword", "UserData", new { userId = Model.Id });
    }
    </div>
</div>

编辑密码的部分视图：

@model Project.Web.Models.Shared.EditPasswordViewModel

<div id="summary">
    @Html.ValidationSummary(false)
</div>

<div class="row">
    @using (Html.BeginForm("EditPassword", "UserData", FormMethod.Post, new { id = "editpasswordform", @class = "form-horizontal site-validation" }))
    {
        @Html.AntiForgeryToken()
        @Html.HiddenFor(o => o.Id)
        @Html.PasswordFor(o => o.Password, new { @class = "col-xs-12 form-control", type = "password", id = "password-field" })
        @Html.TextBoxFor(o => o.NewPassword, new { @class = "col-xs-12", type = "text", id = "new-password-field"})
        @Html.TextBoxFor(o => o.RepeatNewPassword, new { @class = "col-xs-12", type = "password", id = "repeat-new-password-field"})

        <button type="submit" class="width-35 pull-right btn btn-sm btn-primary">
            <i class="icon-hdd"></i>
            Save
        </button>
    }
</div>

最后用控制器方法保存密码并返回相同的视图：

[HttpPost]
[ValidateAntiForgeryToken]
[Authorize()]
public PartialViewResult EditPassword(EditPasswordViewModel model)
{
    try
    {
        if (ModelState.IsValid)
        {
            //Get the user
            User user = GetUserById(model.Id);

            //Update the user
            UpdatePassword(user.Username, model.Password, model.NewPassword);
        }

        return PartialView("_EditPassword", model);
    }
    catch (DomainException ex)
    {
        ModelState.AddModelError("", ex.Message);
        return PartialView("_EditPassword", model);
    }
}

谢谢！

使用部分视图创建可重用表单

0 个答案: