Question

我正在学习mvc。我有一个模特。现在我想用html helper构建表单。因此，当调用索引操作时，我想手动填充模型数据并将模型发送到视图。这是我的模型数据，但由于缺乏知识，我想要构建形式的方式不可能。所以，如果有可能帮助我

namespace MvcPractise.Models
{
    public class Student
    {
        [Required(ErrorMessage = "First Name Required")] // textboxes will show
        [Display(Name = "First Name :")]
        [StringLength(5, ErrorMessage = "First Name cannot be longer than 5 characters.")]
        public string FirstName { get; set; }

        [Required(ErrorMessage = "Last Name Required")] // textboxes will show
        [Display(Name = "Last Name :")]
        [StringLength(5, ErrorMessage = "Last Name cannot be longer than 5 characters.")]
        public string LastName { get; set; }

        [Required(ErrorMessage = "DOB require")] // datepicker will show
        [Display(Name = "DOB :")]
        [DataType(DataType.Date)]
        public DateTime Dob { get; set; }

        [Required(ErrorMessage = "State Required")] // drodown will show
        [Display(Name = "State :")]
        public List<State> State { get; set; }

        [Required(ErrorMessage = "City Required")] // drodown will show
        [Display(Name = "City :")]
        public List<City> City { get; set; }

        [Required(ErrorMessage = "Language known Required")] // group of checkboxes will show
        [Display(Name = "Language known :")]
        public List<Language> Language { get; set; }

        [Required(ErrorMessage = "Sex Required")] // group of radio button will show
        [Display(Name = "Sex :")]
        public List<Sex> Sex { get; set; }

        [Required(ErrorMessage = "Computer Course Required")] // listbox will show
        [Display(Name = "Computer Course Done :")]
        public List<ComputerCourse> ComputerCourse { get; set; }

    }

    public class State
    {
        public string ID { get; set; }
        public string Name { get; set; }
    }

    public class City
    {
        public string ID { get; set; }
        public string Name { get; set; }
    }

    public class Language
    {
        public string ID { get; set; }
        public string Name { get; set; }
    }

    public class Sex
    {
        public string ID { get; set; }
        public string Type { get; set; }
    }

    public class ComputerCourse
    {
        public string ID { get; set; }
        public string Type { get; set; }
    }
}

1）名字＆amp;我希望显示文本框的姓氏属性

2）对于DOB属性，我想显示带有日期选择器的文本框

3）对于DOB属性，我想显示带有日期选择器的文本框

4）对于我希望显示下拉列表或组合的州/城市属性

5）对于语言属性，我想显示一组复选框

6）对于性别属性，我想显示男性和女性的2个单选按钮;女

7）对于计算机课程属性，我想显示列表框

现在编写一个索引操作方法，该方法将使用虚拟数据填充模型并生成UI。当单击“保存”按钮时，模型数据将返回到名为“已保存”的操作方法

公共ActionResult保存（学生） { return view（s）; }

或

public ActionResult Save（StudentViewModel sv） { return View（）; }

指导我如何继续。感谢

更新

我可以用这种方式手动填充我们的模型

var model =  new Student()

{

    FirstName = "John",

    LastName = "Doe",

    Dob = DateTime.Now,

    State = new list<State>()
        {
            new state({ID="1" , Name = "test1"});
            new state({ID="2" , Name = "test2"});
            new state({ID="3" , Name = "test3"});
        };

}

特别看到这个代码....它是否有效bcoz我现在不在我的电脑前。

 State = new list<State>()
            {
                new state({ID="1" , Name = "test1"});
                new state({ID="2" , Name = "test2"});
                new state({ID="3" , Name = "test3"});
            };

Answer 1

1）名字＆amp;我希望显示文本框的姓氏属性

@Html.EditorFor(x => x.FirstName)
@Html.EditorFor(x => x.LastName)

2）对于DOB属性，我想显示带有日期选择器的文本框

@Html.TextBoxFor(x => x.Dob, new { @class = "datePicker" })

现在选择一个最喜欢的javascript日期选择器库并将其附加到具有日期类的所有元素。例如，您可以使用jQuery UI datepicker：

$(function() {
    $('.datePicker').datepicker();
});

4）对于我希望显示下拉列表或组合的州/城市属性

@Html.DropDownListFor(x => x.SelectedState, new SelectList(Model.State, "ID", "Name"))

请注意此处使用的SelectedState属性。您需要将其作为字符串属性添加到模型中以保存值。

5）对于语言属性，我想显示一组复选框

首先在语言模型中添加一个布尔属性，以便知道它是否被选中：

public class Language
{
    public string ID { get; set; }
    public string Name { get; set; }
    public bool Selected { get; set; }
}

然后：

@for (var i = 0; i < Model.Language.Count;i++)
{
    @Html.HiddenFor(x => Model.Language[i].ID)
    @Html.HiddenFor(x => Model.Language[i].Name)
    @Html.LabelFor(x => Model.Language[i].Selected, Model.Language[i].Name)
    @Html.CheckBoxFor(x => Model.Language[i].Selected)
}

6）对于性别属性，我想显示男性和女性的2个单选按钮;女

然后将其声明为字符串，而不是某些列表：

public string Sex { get; set; }

然后在你看来：

@Html.RadioButtonFor(x => x.Sex, "Male")
@Html.RadioButtonFor(x => x.Sex, "Female")

7）对于计算机课程属性，我想显示列表框

@Html.ListBoxFor(x => x.SelectedCourses, new SelectList(Model.ComputerCourse, "ID", "Type"))

现在编写一个索引操作方法，该方法将使用虚拟数据填充模型并生成UI

public AcitonResult Index()
{
    Student student = ... go hit your backend to get a student
    return View(student);
}

在视图中，您将有一个表单：

@model Student
@using (Html.BeginForm())
{
    ... generate the desired input fields

    <button type="submit">OK</button>
}

然后在提交表单时调用POST操作：

[HttpPost]
public AcitonResult Index(Student student)
{
    ...
}

最佳做法是使用视图模型，而不是传递给您的域模型。

如何在MVC中将表单与复杂模型数据绑定

更新

1 个答案: