Question

我正在尝试创建一个可以编辑项目属性的页面，例如Employees

public class Employee
{
    //user information
    public int ID { get; set; }

    [Required(ErrorMessage = "First Name is required")]
    [MaxLength(20)]
    public string FirstName { get; set; }

    [Required(ErrorMessage = "Last Name is required")]
    [MaxLength(10)]
    public string LastName { get; set; }

    [Required(ErrorMessage = "Hometown is required")]
    [MaxLength(10)]
    public string HomeTown { get; set; }

    //optional
    public string SpouseName { get; set; }
    public string KidNameOne { get; set; }
    public string KidNameTwo { get; set; }

    //your information
    [Required(ErrorMessage = "Your name is required")]
    [MaxLength(20)]
    public string YourName { get; set; }

    [Required(ErrorMessage = "Your address is required")]
    [MaxLength(100)]
    public string YourAddress { get; set; }

}

现在我知道如何创建视图或控制器来编辑员工但现在我想通过将可选信息与绝对必要信息分开来简化页面例如，在页面顶部有一个下拉列表，其中包含必要信息和可选信息选项如果我选择了必要的信息，则只显示名字姓氏和家乡，供用户编辑或查看如果我选择了可选项，则会显示其他所有内容（不包括必要的内容）。

我想到了部分视图，但不确定它是否有用。我只需要一个如何实现这一目标的方向。因为我从未做过任何与MVC中的剃刀代码动态视图有关的事情。

我需要有关如何处理此问题的建议。

Answer 1

因此用户应该能够选择是否要查看可选字段？这可能应该由客户端JavaScript处理，而不是MVC特定的。

这是一个简单的“扩展器”式解决方案，使用jQuery：

<ul>
    <li>
        @Html.LabelFor(m => m.FirstName)
        @Html.TextBoxFor(m => m.FirstName)
    </li>
    <li>
        @Html.LabelFor(m => m.LastName)
        @Html.TextBoxFor(m => m.LastName)
    </li>
    ...
</ul>

<a href="#" onclick="toggleOptional()" >Optional info..</a>
<ul id="optional" >
    <li>
        @Html.LabelFor(m => m.KidNameOne)
        @Html.TextBoxFor(m => m.KidNameOne)
    </li>
    <li>
        @Html.LabelFor(m => m.KidNameTwo)
        @Html.TextBoxFor(m => m.KidNameTwo)
    </li>
    ...
</ul>

<script type="text/javascript" >
    function toggleOptional() {
        $('#optional').toggle();
    }

    //Runs on jQuery.ready:
    $(function () {
        $('#optional').hide();
    });
</script>

jsfiddle

MVC4动态视图使用相同的模型

1 个答案: