复选框和单选按钮标签包含在<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>

bootstrap复选框和单选按钮的更多相关文章

  1. bootstrap历练实例:复选框或单选按钮作为输入框组的前缀或后缀

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  2. spring mvc:常用标签库(文本框,密码框,文本域,复选框,单选按钮,下拉框隐藏于,上传文件等)

    在jsp页面需要引入:<%@taglib uri="http://www.springframework.org/tags/form" prefix="form&q ...

  3. 有关下拉列表、复选框、单选按钮、iframe等jquery处理方法

    1.jquery验证复选框互斥选项,代码如下: //验证复选框中的互斥选项 function checkData(name, val1, val2){ //获取所有checkbox值 var chec ...

  4. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:复选框(Checkbox)和单选框(Radio)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  5. jquery 获取一组元素的选中项 - 函数、jquery获取复选框值、jquery获取单选按钮值

    做表单提交时,如果现在还在用form提交,用户体验很差,所以一般使用ajax提交. 其中需要获取每个表单输入元素的值,获取的时候像文本框这些还好说,Jquery提供了 .val() 方法,获取很方便, ...

  6. 8、单选按钮(JRadioButton)和复选框(JCheckBox)

    8.单选按钮(JRadioButton)和复选框(JCheckBox) 实现一个单选按钮(或复选框),此按钮项可被选择或取消选择,并显示其状态.JRadioButton对象与ButtonGroup对象 ...

  7. [ PyQt入门教程 ] PyQt5基本控件使用:单选按钮、复选框、下拉框

    本文主要介绍PyQt5界面最基本使用的单选按钮.复选框.下拉框三种控件的使用方法进行介绍. 1.RadioButton单选按钮/CheckBox复选框.需要知道如何判断单选按钮是否被选中. 2.Com ...

  8. Web前端之复选框选中属性

    熟悉web前端开发的人都知道,判断复选框是否选中是经常做的事情,判断的方法很多,但是开发过程中常常忽略了这些方法的兼容性,而是实现效果就好 了.博主之前用户不少方法,经常Google到一些这个不好那个 ...

  9. [SAP ABAP开发技术总结]选择屏幕——按钮、单选复选框

    声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...

随机推荐

  1. 【记录】新建Cordova项目出现ios-deploy找不到的问题

    按老流程 Cordova create helloApp Cordova platform add ios 之前一般这种操作之后就能有执行的iOS目录了,像这样   然后 Cordova build ...

  2. 【HDOJ6299】Balanced Sequence(贪心)

    题意:给定n个只有左右括号的序列,要求将它们重新排序使得匹配的括号对数最大. n<=1e5 s[i]<=1e5 sum s[i]<=5e6 思路: 先把每个串内部的匹配数量减去,剩下 ...

  3. 【POJ3254】Corn Fields(状压DP)

    题意: 一个M x N矩阵里有很多格子,每个格子有两种状态,可以放牧和不可以放牧,可以放牧用1表示,否则用0表示,在这块牧场放牛,要求两个相邻的方格不能同时放牛,即牛与牛不能相邻.问有多少种放牛方案( ...

  4. 【BZOJ1237】配对(贪心,DP)

    题意:有n个a[i]和b[i],调整顺序使abs(a[i]-b[i])之和最小,但a[i]<>b[i].保证所有 Ai各不相同,Bi也各不相同. 30%的数据满足:n <= 104 ...

  5. Flex嵌入HTML页面

    这段时间一直在苦心研究Flex,今天突然想,我们平时都是把swf放到网页中,怎么才能把网页嵌入到Flex中呢?我查了一些资料,然后经过自己的不懈努力,终于搞定. 为了方便,写了个嵌入HTML页面的代理 ...

  6. 第18章:MYSQL分区

    第18章:分区 目录 18.1. MySQL中的分区概述 18.2. 分区类型 18.2.1. RANGE分区 18.2.2. LIST分区 18.2.3. HASH分区 18.2.4. KEY分区 ...

  7. Sudoku---hdu2676(数独DFS)

    http://poj.org/problem?id=2676 递归深搜 #include<stdio.h> #include<string.h> #include<alg ...

  8. Spring Boot使用HandlerInterceptorAdapter和WebMvcConfigurerAdapter实现原始的登录验证

    HandlerInterceptorAdapter的介绍:http://www.cnblogs.com/EasonJim/p/7704740.html,相当于一个Filter拦截器,但是这个颗粒度更细 ...

  9. [RxJS] `add` Inner Subscriptions to Outer Subscribers to `unsubscribe` in RxJS

    When subscribers create new "inner" sources and subscriptions, you run the risk of losing ...

  10. Error Code: 2006 - MySQL 鏈嶅姟鍣ㄥ凡绂荤嚎

    将sql文件导入到mysql时候,就一直报这个错误. 我试过网上各种方法都行不通. 最后将以下一句运行了一下就能够了,并且没有重新启动mysql. SET GLOBAL max_allowed_pac ...