• 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" id="optionsRadios1" 
             value="option1" checked> 选项 1
       </label>
    </div>
    <div class="radio">
       <label>
          <input type="radio" name="optionsRadios" id="optionsRadios2" 
             value="option2">
             选项 2 - 选择它将会取消选择选项 1
       </label>

    内联的复选框和单选按钮,
    • 对一系列复选框和单选框使用 .checkbox-inline 或 .radio-inline class,控制它们显示在同一行上。


    <div>
       <label class="checkbox-inline">
          <input type="checkbox" id="inlineCheckbox1" value="option1"> 选项 1
       </label>
       <label class="checkbox-inline">
          <input type="checkbox" id="inlineCheckbox2" value="option2"> 选项 2
       </label>
       <label class="checkbox-inline">
          <input type="checkbox" id="inlineCheckbox3" value="option3"> 选项 3
       </label>
       <label class="checkbox-inline">
          <input type="radio" name="optionsRadiosinline" id="optionsRadios3" 
             value="option1" checked> 选项 1
       </label>
       <label class="checkbox-inline">
          <input type="radio" name="optionsRadiosinline" id="optionsRadios4" 
             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>

  • 相关阅读:
    react脚手架搭建及配置
    mac使用技巧
    nginx配置
    vue常见前端UI库
    自定义指令
    代码缩进修改
    webpack学习入门
    webpack使用extract-text-webpack-plugin打包时提示错误
    webpack未成功全局安装
    基于jQuery的AJAX实现三级联动菜单
  • 原文地址:https://www.cnblogs.com/liuyuanhao/p/4350591.html
Copyright © 2020-2023  润新知