复选框和单选按钮标签包含在<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. 2016 Multi-University Training Contest 9 solutions BY 金策工业综合大学

    A Poor King Tag: Reversed BFS Preprocessing is needed to calculate answers for all positions (states ...

  2. 使用Navicat进行数据库对比同步

    使用Navicat进行数据库对比同步 当有多个数据库时,有时会出现结构或者数据不同步的问题,这时候可以使用navivat工具对比同步( 我的Navicat版本是11.0.17). 参考博客: 岁伏的博 ...

  3. Event Logging 技术简介

    https://blog.csdn.net/xiliang_pan/article/details/41805023

  4. django学习之- 信号

    - Django内置的信号Model signals pre_init # django的modal执行其构造方法前,自动触发 post_init # django的modal执行其构造方法后,自动触 ...

  5. 一致性哈希算法-----> 解决memecache 服务器扩容后的数据丢失。

    1 基本场景 比如你有 N 个 cache 服务器(后面简称 cache ),那么如何将一个对象 object 映射到 N 个 cache 上呢,你很可能会采用类似下面的通用方法计算 object 的 ...

  6. [Bzoj3131][Sdoi2013]淘金(数位dp)(优先队列)

    3131: [Sdoi2013]淘金 Time Limit: 30 Sec  Memory Limit: 256 MBSubmit: 847  Solved: 423[Submit][Status][ ...

  7. MongoDB学习day08--mongoose预定义修饰符和getter、setter修饰符

    一.mongoose预定义修饰符 lowercase. uppercase . trim var UserSchema=mongoose.Schema({ name:{ type:String, tr ...

  8. asterisk 相关数据库配置 使用

    Linux/Unix下ODBC的安装: 先下载最新的unixODBC源码包(http://www.unixodbc.org/unixODBC-2.2.1.tar.gz)放到/usr/local下,然后 ...

  9. win10安装mysql5.6,mysql启动时,闪退

    首先在服务中查看是不是mysql启动了 发现在服务中没有mysql服务, 然后找到mysql的安装目录 MYSQL SERVER 5.6 中将my-default.ini 改为my.ini 使用命令行 ...

  10. VC++中的int main(int argc, char argv[])是什么意思

    这是C/C++的一重要函数,叫主函数.无论程序多复杂,代码中必须有这么一个函数,也只能有一个这样的函数:程序执行时就是从这个函数进入的.由于问得比较笼统,如果你想知道详细情况的话,发给你一个网友的求助 ...