Question

我想知道我是否可以将我的div按钮组（btn-group）转换为我的asp.net mvc应用程序中的razor语法？我想要剃刀语法，这样我就可以在进入页面时预先选择并预先激活按钮标签。如果不需要剃须刀，那么有人可以告诉我如何在从我的视图模型数据输入的页面上激活和选择按钮吗？似乎没有剃刀，我必须将我的viewmodel数据传递给javascript来执行，但这似乎并不正确。这是我的HTML

＆＃13;

<div class="form-group">
                @Html.LabelFor(model => model.Listing.SpaceType, htmlAttributes: new { @class = "control-label" })
                
                <div class="btn-group form-control" data-toggle="buttons" id="SpaceType">
                    <label id="SpaceTypeLabel0" class="btn btn-primary">
                        <input type="radio" name="typeoptions" autocomplete="off" id="0"> House
                    </label>
                    <label id="SpaceTypeLabel1" class="btn btn-primary">
                        <input type="radio" name="typeoptions" autocomplete="off" id="1"> Apartment
                    </label>
                    <label id="SpaceTypeLabel2" class="btn btn-primary">
                        <input type="radio" name="typeoptions" autocomplete="off" id="2"> Studio
                    </label>
                    <label id="SpaceTypeLabel3" class="btn btn-primary">
                        <input type="radio" name="typeoptions" autocomplete="off" id="3"> Other
                    </label>
                </div>
            </div>

＆＃13;

这是我的模特

public class Space
{
    public int SpaceId { get; set; }

    public virtual SpaceOverview Overview { get; set; }

    public virtual SpaceDetails Details { get; set; }

    public virtual SpaceListing Listing { get; set; }

    public virtual SpaceAddress Address { get; set; }

    [Required]
    public DateTime DateCreated { get; set; }
}

和空间列表是

public class SpaceListing
{
    [Key, ForeignKey("SpaceOf")]
    public int SpaceListingId { get; set; }

    public SpaceType SpaceType { get; set; }

    public SpaceLocation SpaceLocation { get; set; }

    public SpaceAccommodation Accommodation { get; set; }

    public Space SpaceOf { get; set; } // one-to-one
}

和spacetype是

public enum SpaceType
{
    Home,
    Apartment,
    Studio,
    Park,
    Beach,
    Field,
    Backyoard,
    FrontYard,
    Other
}

Answer 1

目前，您正在创建一组与name="typeoptions"无关的单选按钮，这些按钮与模型没有任何关系，您甚至不给单选按钮赋值属性，因此无论如何都不会回发。

语法应为

@Html.RadioButtonFor(m => m.Listing.SpaceType, "House", new { id = "House" })
@Html.Label("House")
@Html.RadioButtonFor(m => m.Listing.SpaceType, "Apartment", new { id = "Apartment" })
@Html.Label("Apartment")
...

为了简化这一过程，您可以创建一个扩展方法

public static class RadioButtonHelper
{
  public static MvcHtmlString EnumRadioButtonListFor<TModel, TValue>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TValue>> expression)
  {
    ModelMetadata metaData = ModelMetadata.FromLambdaExpression(expression, helper.ViewData);
    string name = ExpressionHelper.GetExpressionText(expression);
    Type type = Nullable.GetUnderlyingType(metaData.ModelType);
    if (type == null || !type.IsEnum)
    {
      throw new ArgumentException(string.Format("The property {0} is not an enum", name));
    }
    StringBuilder html = new StringBuilder();
    foreach (Enum item in Enum.GetValues(type))
    {
      string id = string.Format("{0}_{1}", metaData.PropertyName, item);
      StringBuilder innerHtml = new StringBuilder();
      innerHtml.Append(helper.RadioButtonFor(expression, item, new { id = id }));
      innerHtml.Append(helper.Label(id, item.ToDescription()));
      TagBuilder div = new TagBuilder("div");
      div.AddCssClass("radiobutton");
      div.InnerHtml = innerHtml.ToString();
      html.Append(div.ToString());
    }
    TagBuilder container = new TagBuilder("div");
    container.AddCssClass("radiobutton-container");
    container.InnerHtml = html.ToString();
    return MvcHtmlString.Create(container.ToString());
  }
}

注意，这使用以下扩展方法

public static string ToDescription(this Enum value)
{
  FieldInfo field = value.GetType().GetField(value.ToString());
  DescriptionAttribute[] attributes = (DescriptionAttribute[])field.GetCustomAttributes(typeof(DescriptionAttribute), false);
  if (attributes.Length > 0)
  {
    return attributes[0].Description;
  }
  return value.ToString();
}

允许您使用友好的＆＃39;来装饰枚举值。名称

public enum SpaceType
{
  Home,
  [Description("2 bed apartment")]
  Apartment,
  ....
}

并在视图中

@Html.EnumRadioButtonListFor(m => m.Listing.SpaceType)

按钮组成剃刀语法

1 个答案: