您的位置：首页 > 产品设计 > UI/UE

MVC通过UIHint和自定义视图显示RadioButtonList

2014-05-27 16:14 393 查看
在Product类中有一个显示删除状态的属性DelFlag，在编辑视图页，对于所有的删除状态以RadioButtonList显示出来，如果RadioButtonList选项的value值与当前model的DelFlag属性值相同，则勾选该选项，如图：





思路：

→在Views/Shared/EditorTemplates/RadioButtonList.chtml部分视图以RadioButtonList呈现所有删除状态。
→在编辑视图中，需要把有关删除状态，封装成List<SelectListItem>放在路由中传递给部分视图RadioButtonList.chtml
→在Product的DelFlag属性上，通过[UIHint("RadioButtonList")]指定该属性的显示视图

publicclassProduct
{
[UIHint("RadioButtonList")]
publicint?DelFlag{get;set;}
}

HomeController:

publicclassHomeController:Controller
{
publicActionResultIndex()
{
returnView(newProduct(){DelFlag=2});
}

}

Home/Index.cshtml视图：

其中，关于删除状态，封装成List<SelectListItem>，并通过路由传递给接收的部分视图。

@modelMvcApplication2.Models.Product
@{
ViewBag.Title="Index";
Layout="~/Views/Shared/_Layout.cshtml";
List<SelectListItem>list=newList<SelectListItem>();
list.Add(newSelectListItem(){Text="正常使用",Value="1"});
list.Add(newSelectListItem(){Text="逻辑删除",Value="2"});
list.Add(newSelectListItem(){Text="物理删除",Value="3"});
}
<styletype="text/css">
ul{
list-style-type:none;
}
</style>
<h2>Index</h2>
@Html.EditorFor(model=>model.DelFlag,new{lst=list})

.csharpcode,.csharpcodepre
{
font-size:small;
color:black;
font-family:consolas,"CourierNew",courier,monospace;
background-color:#ffffff;
/*white-space:pre;*/
}
.csharpcodepre{margin:0em;}
.csharpcode.rem{color:#008000;}
.csharpcode.kwrd{color:#0000ff;}
.csharpcode.str{color:#006080;}
.csharpcode.op{color:#0000c0;}
.csharpcode.preproc{color:#cc6633;}
.csharpcode.asp{background-color:#ffff00;}
.csharpcode.html{color:#800000;}
.csharpcode.attr{color:#ff0000;}
.csharpcode.alt
{
background-color:#f4f4f4;
width:100%;
margin:0em;
}
.csharpcode.lnum{color:#606060;}

Views/Shared/EditorTemplates/RadioButtonList.chtml部分视图:

@modelint?
@{
varlist=(List<SelectListItem>)ViewData["lst"];
}
<ul>
@foreach(variteminlist)
{
<li>
@{
varradioId=ViewData.TemplateInfo.GetFullHtmlFieldId(item.Value);//DelFlag_1DelFlag_2DelFlag_3
varcheckedCls=
(item.Value==Model.ToString()?"Checked":string.Empty);
//name=DelFlag属性名称被保存在ViewData.TemplateInfo.HtmlFieldPrefix中
<inputtype="radio"id="@radioId"name="@ViewData.TemplateInfo.HtmlFieldPrefix"value="@item.Value"checked="@checkedCls"/>
<labelfor="@radioId">@item.Text</label>
}
</li>
}
</ul>

.csharpcode,.csharpcodepre
{
font-size:small;
color:black;
font-family:consolas,"CourierNew",courier,monospace;
background-color:#ffffff;
/*white-space:pre;*/
}
.csharpcodepre{margin:0em;}
.csharpcode.rem{color:#008000;}
.csharpcode.kwrd{color:#0000ff;}
.csharpcode.str{color:#006080;}
.csharpcode.op{color:#0000c0;}
.csharpcode.preproc{color:#cc6633;}
.csharpcode.asp{background-color:#ffff00;}
.csharpcode.html{color:#800000;}
.csharpcode.attr{color:#ff0000;}
.csharpcode.alt
{
background-color:#f4f4f4;
width:100%;
margin:0em;
}
.csharpcode.lnum{color:#606060;}
                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                

                    
                

            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航