So I'm using Twitter Bootstrap and most of my forms are looking fantastic with this
<div class="control-group">
@Html.LabelFor(m => m.Prop)
<div class="controls">
@Html.EditorFor(m => m.Prop)
</div>
@Html.ValidationMessageFor(model => model.Prop)
</div>
The only issue is with Radio Buttons and Check Boxes. Twitter Bootstrap calls for HTML5 style labels that include the radio or checkbox input INSIDE the label tag like this
<label class="checkbox">
<input type="checkbox"> Check me out
</label>
If I can't create these with a with @Html or and overload can I at least get to the text that's created by Labelfor?
<label class="checkbox">
@Html.EditorFor(m=> m.Prop)
@Html.TheVariableThatContainsTheTextThatLabelForUsesFor(m => m.Prop)
</label>
Why can't you create these with an @Html. If you write your own extension method (see below) that should do it, no?
public static class HtmlHelperExtensions
{
public static MvcHtmlString MyCheckBoxFor<TModel>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, bool>> expression, object htmlLabelAttributes = null, object htmlCheckBoxAttributes = null)
{
var checkbox = htmlHelper.CheckBoxFor(expression, htmlCheckBoxAttributes);
var labelTag = new TagBuilder("label");
labelTag.AddCssClass("checkbox");
labelTag.MergeAttributes(HtmlHelper.AnonymousObjectToHtmlAttributes(htmlLabelAttributes));
labelTag.InnerHtml = checkbox.ToString();
return new MvcHtmlString(labelTag.ToString());
}
}
How about this revised version. This replicates exactly what the label does.
public static class HtmlHelperExtensions
{
public static MvcHtmlString MyCheckBoxFor<TModel>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, bool>> expression, object htmlLabelAttributes = null, object htmlCheckBoxAttributes = null)
{
var checkbox = htmlHelper.CheckBoxFor(expression, htmlCheckBoxAttributes);
var labelTag = new TagBuilder("label");
var checkboxName = ExpressionHelper.GetExpressionText(expression);
labelTag.AddCssClass("checkbox");
labelTag.MergeAttributes(HtmlHelper.AnonymousObjectToHtmlAttributes(htmlLabelAttributes));
labelTag.InnerHtml = checkbox.ToString() + LabelHelper(ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData), checkboxName);
return new MvcHtmlString(labelTag.ToString());
}
private static MvcHtmlString LabelHelper(ModelMetadata metadata, string fieldName)
{
string labelText;
var displayName = metadata.DisplayName;
if (displayName == null)
{
var propertyName = metadata.PropertyName;
labelText = propertyName ?? fieldName.Split(new[] { '.' }).Last();
}
else
{
labelText = displayName;
}
if (string.IsNullOrEmpty(labelText))
{
return MvcHtmlString.Empty;
}
return new MvcHtmlString(labelText);
}
}
I should note that with MVC 4 there is a DisplayNameFor Helper, so that whole label business could be simplified a bit.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With