在将EditorFor()
与值类型的模板一起使用时,我们如何访问模型的属性名称,例如下面的bool
类型?
似乎MVC以某种方式提取属性名称,因为它正确地呈现了具有正确属性名称的复选框(或文本框,如果使用的话),但是MVC从哪里获取它?
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<bool>" %>
<fieldset>
<legend>insert boolean property name here or the value of DisplayName attribute??</legend>
<div class="clear">
<p>
<%: Html.CheckBox("", Model) %>
<span>insert boolean property name here or the value of DisplayName attribute??</span>
</p>
</div>
</fieldset>
答案 0 :(得分:1)
使用MVC3,Jquery 1.7和CSS3
的EditorTemplates的布尔类型示例EditorTemplates Boolean.cshtml
@model bool
@{
string propertyName = Html.ViewData.ModelMetadata.PropertyName;
}
<div class="field switch">
@if (@Model == true)
{
<label class="cb-enable selected">
<span>Yes</span></label>
<label class="cb-disable">
<span>No</span></label>
<input type="checkbox" id="@propertyName" class="checkbox" name="@propertyName" value="true" checked=checked />
}
else
{
<label class="cb-enable">
<span>Yes</span></label>
<label class="cb-disable selected">
<span>No</span></label>
<input type="checkbox" id="@propertyName" class="checkbox" name="@propertyName" value="false" />
}
</div>
<script>
$(document).ready(function () {
$(".cb-enable").click(function () {
var parent = $(this).parents('.switch');
$('.cb-disable', parent).removeClass('selected');
$(this).addClass('selected');
$('.checkbox', parent).attr('checked', true);
$('.checkbox', parent).attr('value', true);
});
$(".cb-disable").click(function () {
var parent = $(this).parents('.switch');
$('.cb-enable', parent).removeClass('selected');
$(this).addClass('selected');
$('.checkbox', parent).attr('checked', false);
$('.checkbox', parent).attr('value', false);
});
});
</script>
CSS
.cb-enable, .cb-disable, .cb-enable span, .cb-disable span
{
display: block; float: left;
}
.cb-enable {
display: block;
float: left;
border: 1px solid #EEE;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-right-radius: 0;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 0;
-moz-border-radius-bottomleft: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 0px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 5px;
}
.cb-disable
{
display: block; float: left; border: 1px solid #EEE;
.roundedCorners(0px,5px,0px,5px);
}
.cb-enable span, .cb-disable span
{
line-height: 30px; display: block; background-repeat: no-repeat;
}
.cb-enable span { padding: 0 10px; }
.cb-disable span { padding: 0 10px; }
.cb-disable.selected
{
background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, transparent), color-stop(100%, rgba(0, 0, 0, 0.25))),#D5D5D5;
background: -webkit-linear-gradient(top, transparent,rgba(0, 0, 0, 0.25)),#D5D5D5;
background: -moz-linear-gradient(top, transparent,rgba(0, 0, 0, 0.25)),#D5D5D5;
background: -o-linear-gradient(top, transparent,rgba(0, 0, 0, 0.25)),#D5D5D5;
background: -ms-linear-gradient(top, transparent,rgba(0, 0, 0, 0.25)),#D5D5D5;
background: linear-gradient(top, transparent,rgba(0, 0, 0, 0.25)),#D5D5D5;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-right-radius: 0;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 0;
-moz-border-radius-bottomleft: 5px;
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4);
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4);
-o-box-shadow: 0 1px 2px rgba(0,0,0,0.4);
box-shadow: 0 1px 2px rgba(0,0,0,0.4);
text-shadow: rgba(0, 0, 0, 0.2) 0 -1px 1px;
color: white;
}
.cb-disable.selected span { color: #fff; }
.cb-enable.selected
{
background: #129EE8;
background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, transparent), color-stop(100%, rgba(0, 0, 0, 0.25))),#129EE8;
background: -webkit-linear-gradient(top, transparent,rgba(0, 0, 0, 0.25)),#129EE8;
background: -moz-linear-gradient(top, transparent,rgba(0, 0, 0, 0.25)),#129EE8;
background: -o-linear-gradient(top, transparent,rgba(0, 0, 0, 0.25)),#129EE8;
background: -ms-linear-gradient(top, transparent,rgba(0, 0, 0, 0.25)),#129EE8;
background: linear-gradient(top, transparent,rgba(0, 0, 0, 0.25)),#129EE8;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-right-radius: 0;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 0;
-moz-border-radius-bottomleft: 5px;
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4);
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4);
-o-box-shadow: 0 1px 2px rgba(0,0,0,0.4);
box-shadow: 0 1px 2px rgba(0,0,0,0.4);
text-shadow: rgba(0, 0, 0, 0.2) 0 -1px 1px;
}
.cb-enable.selected span { color: #fff; }
.switch label { cursor: pointer; }
.switch input { display: none; }
答案 1 :(得分:0)
<%: ViewData.ModelMetadata.PropertyName %>
或:
<%: ViewData.ModelMetadata.DisplayName %>
更新:
资源本地化显示属性的示例:
public class LocalizedDisplayNameAttribute : DisplayNameAttribute
{
public LocalizedDisplayNameAttribute(string name)
: base(GetValueFromResource(name))
{ }
private static string GetValueFromResource(string name)
{
// TODO: fetch the display name from wherever you want
throw new NotImplementedException();
}
}