bootstrap复选框和单选按钮 - 众里寻他千万度

bootstrap复选框和单选按钮

复选框和单选按钮标签包含在<Label>标签中
<div class="checkbox"> <label><input type="checkbox" value="">选项 1</label> </div> <div class="checkbox"> <label><input type="checkbox" value="">选项 2</label> </div>
<div class="radio">
   <label>
      <input type="radio" name="optionsRadios"  
         value="option1" checked> 选项 1
   </label>
</div>
<div class="radio">
   <label>
      <input type="radio" name="optionsRadios"  
         value="option2">
         选项 2 - 选择它将会取消选择选项 1
   </label>
内联的复选框和单选按钮,
  • 对一系列复选框和单选框使用 .checkbox-inline.radio-inline class,控制它们显示在同一行上。

<div>
   <label class="checkbox-inline">
      <input type="checkbox"  value="option1"> 选项 1
   </label>
   <label class="checkbox-inline">
      <input type="checkbox"  value="option2"> 选项 2
   </label>
   <label class="checkbox-inline">
      <input type="checkbox"  value="option3"> 选项 3
   </label>
   <label class="checkbox-inline">
      <input type="radio" name="optionsRadiosinline"  
         value="option1" checked> 选项 1
   </label>
   <label class="checkbox-inline">
      <input type="radio" name="optionsRadiosinline"  
         value="option2"> 选项 2
   </label>
</div>
基架自动创建的Create 视图的代码:

如果是一个对象的成员是枚举类型,基架的 Create视图会自动生成枚举类型的下拉菜单。 @Html.EnumDropDownListFor(model => model.NotificationType, htmlAttributes: new { @class =

"form-control" })

<div class="form-group">

@Html.LabelFor(model => model.NotificationType, htmlAttributes: new { @class = "control-label col-md-2" })

<div class="col-md-10">

@Html.EnumDropDownListFor(model => model.NotificationType, htmlAttributes: new { @class = "form-control" })

虽然下面用的是@Html.EditorFor方法,但是 MVC框架能识别它是一个boolean类型,因此,会使用checkbox来渲染视图。

<div class="form-group">

@Html.LabelFor(model => model.IsDismissed, htmlAttributes: new { @class = "control-label col-md-2" })

<div class="col-md-10">

<div class="checkbox">

@Html.EditorFor(model => model.IsDismissed)

@Html.ValidationMessageFor(model => model.IsDismissed, "", new { @class = "text-danger" })

</div>

</div>

</div>

@Html.ValidationMessageFor(model => model.NotificationType, "", new { @class = "text-danger" })

</div>

</div>