MVC基础知识整理（三）HTML辅助方法的反填

文本框的反填

• 前台代码，辅助方法实现文本框

@model UI.Models.HtmlViewModel
@using (Html.BeginForm("Index","Html",FormMethod.Post))
{
    @Html.TextBoxFor(m=>m.Name) 
}
复制代码

• 后台代码，实例化一个视图模型，给其赋值，返回视图

public ActionResult Index() {
    HtmlViewModel mod = new HtmlViewModel();
    mod.Name = "张三";
    return View(mod)
} 
复制代码

• 网页样式

单选按钮的反填

• 前台代码，辅助方法实现单选按钮

@model UI.Models.HtmlViewModel
@using (Html.BeginForm("Index","Html",FormMethod.Post))
{
   @Html.RadioButtonFor(m=>m.Sex ,true)   
   @Html.RadioButtonFor(m=>m.Sex ,false) 
}
复制代码

• 后台代码，实例化一个视图模型，给其赋值，返回视图

public ActionResult Index() {
    HtmlViewModel mod = new HtmlViewModel();
    mod.Sex = true;
    return View(mod)
} 
复制代码

• 网页样式

复选框和下拉框比较发杂，得在控制器建立 List<SelectListItem> 集，给其添加value和text值，在ViewBan.list传递到视图页面

复选框的反填

建一个SelectListItem的集合，根据其具备的Value,Text,Selected的属性，来建立复选框，和给复选框赋值

• 前台代码，辅助方法实现复选框

@model UI.Models.HtmlViewModel
@using (Html.BeginForm("Index","Html",FormMethod.Post))
{
 @foreach (var item in @ViewBag.chexklist)
{
    <input name="Hobby" type="checkbox" value="@item.Value" checked="@item.Selected" />@item.Text
}
}
复制代码

• 后台代码,实例化一个视图模型，给其赋值，返回视图

public ActionResult Index() {
   hobby = "1,2";
   string[] hobbyArry = hobby.Split(',');
   List<SelectListItem> chexk = new List<SelectListItem>()
   {
       new SelectListItem{Value="0" ,Text="登山",Selected=hobbyArry.Contains("0")},
       new SelectListItem{Value="1" ,Text="游泳",Selected=hobbyArry.Contains("1")},
       new SelectListItem{Value="2" ,Text="学习",Selected=hobbyArry.Contains("2")}
   };
   ViewBag.chexklist = chexk;
    return View(mod)
} 

复制代码

• 网页样式

下拉框的反填

建一个SelectListItem的集合，根据其具备的Value,Text的属性，来建立下拉框

• 前台代码，辅助方法实现复选框

@model UI.Models.HtmlViewModel
@using (Html.BeginForm("Index","Html",FormMethod.Post))
{
 @Html.DropDownListFor(m => m.country, @ViewBag.country as SelectList)
}
复制代码

• 后台代码,实例化一个视图模型，给其赋值，返回视图

public ActionResult Index() {
   HtmlViewModel mod = new HtmlViewModel();
   List<SelectListItem> country = new List<SelectListItem>()
{
   new SelectListItem{ Value="",Text="请选择"},
   new SelectListItem{ Value="1",Text="中国"},
   new SelectListItem{ Value="2",Text="美国"},
   new SelectListItem{ Value="3",Text="韩国"},
};
    ViewBag.country = country;
    mod.country = "1";
    return View(mod)
} 

复制代码

• 网页样式

复选框和下拉框比较发杂，得在控制器建立 List<SelectListItem> 集，给其添加value和text值，在ViewBan.list传递到视图页面