angularJs(2)表单中下拉框单选多选
多选
<input type="checkbox" ng-model='game' ng-true-value="1" ng-false-value="0"/>游戏
<input type="checkbox" ng-model="video" ng-true-value="1" ng-false-value="0"/>电影单选
<input type="radio" ng-model="sex" value="1" />
<input type="radio" ng-model="sex" value="0" />下拉框
$scope.citys=$scope.data[0].city; 解决第一个选项为空白<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
.ng-cloak{
display: none;
}
</style>
</head> <body ng-app="app" ng-controller="ctr" ng-cloak class="ng-cloak"> <select ng-model="citys"> <option ng-repeat="item in data">{{item.city}}</option>
</select>
<p>{{citys}}</p>
<script src="../angular.js"></script>
<script>
angular.module('app',[])
.controller('ctr',function($scope){
$scope.data=[
{
city:'北京',
code:541654
},
{
city:'上海',
code:5756
},
{
city:'广州',
code:54454
}
];
$scope.citys=$scope.data[0].city; })
</script> </body>
</html>
angularJs(2)表单中下拉框单选多选的更多相关文章
- 在vue中的form表单中下拉框中的数据来自数据库查询到的数据
文章目录 1.实现的效果: 2.前端html代码 3.js中的代码 4.后端的方法 1.实现的效果: 增加一个新的类型到数据库 2.前端html代码 需要注意的部分:prop后边是表单中的字段 v-m ...
- vue 表格中的下拉框单选、多选处理
最近在用vue做前后端分离,需要在表格中用到下拉框,由于需求变动,从最开始的单选变为多选,折腾了许久,记录一下,供后人铺路 vue 中的表格下拉框单选 collectionsColnumOptions ...
- 关于easyui combobox下拉框实现多选框的实现
好长时间没有更博了,一是因为最近真的比较忙,二是因为自己是真的偷懒了,哈哈 好啦,这篇博客主要是总结一些关于easyui combobox下拉框实现多选框的实现,包括前台界面的展示,和后台对数据的获取 ...
- 使用 Select2 下拉框实现复选
使用 Select2 下拉框实现复选 <!DOCTYPE html> <html> <head> <meta http-equiv="Content ...
- jquery模拟下拉框单选框复选Select,Checkbox,Radio
在项目中,你会发现设计稿中常常会有单选框,复选框,但都不是系统默认的样式,这就可以用jquery来模拟它们:如图所示,实现它们所需要的代码如下: 首先需要引入的代码: <link rel=&qu ...
- 纯css美化下拉框、复选框以及单选框样式并用jquery获取到其被选中的val
具体样式如图所示: 注:获取val值时记得要先引入jquery库奥. 1.下拉框 css部分 #cargo_type_id{ font-size: 13px; border: solid 1px #b ...
- asp.net MVC4 表单 - 下拉框
1.下拉框代码方式 控制器内构建下拉项目: List<SelectListItem> list = new List<SelectListItem>(); list.Add(n ...
- extjs下拉框添加复选框
给ComboBox组件配置listConfig 下拉框代码: var gyslxcm = Ext.create('Ext.form.field.ComboBox',{ id : 'gyslxcm', ...
- JS-日期框、下拉框、全选复选框
<!-- 下拉框 --><link rel="stylesheet" href="static/ace/css/chosen.css" /&g ...
随机推荐
- springJDBC01 利用springJDBC操作数据库
1 什么是springJDBC spring通过抽象JDBC访问并一致的API来简化JDBC编程的工作量.我们只需要声明SQL.调用合适的SpringJDBC框架API.处理结果集即可.事务由Spri ...
- 业务逻辑:shiro框架的功能实现
思路:分别在web.xml配置过滤器以及在applicationContext.xml去配置 实现步骤:1.在pom.xml里引入shiro的坐标 2.在web.xml里配置shiro过滤器 3.在a ...
- ZROI2018提高day4t2
传送门 分析 我们二分球的直径,然后就像奶酪那道题一样,将所有距离相遇直径的点用并查集连在一起,然后枚举所有与上边的顶距离小于直径的点和所有与下边的距离小于直径的点,如果它们被并查集连在一起则代表这个 ...
- debug配置
- Hibernate 处理查询 in 字句
from : http://blog.csdn.net/wodestudy/article/details/38200421 在处理hibernate的实体查询,一般可以采用多种方式处理复杂的查询,比 ...
- python--tkinter桌面编程开发--记事本
什么是TK\Tkinter Tkinter是连接Python和TK图形库的一个纽带(接口) Hello Tkinter from tkinter import * root=Tk() #tk类的一个实 ...
- ElementUI的表单和vee-validate结合使用时发生冲突的解决
在Vue项目中使用ElementUI表单时,同时又引入了vee-validate进行使用的时候,在浏览器上会出现这样的报错: [Vue warn]: The computed property &qu ...
- 解决Visiual Studio2012 CLR20r3问题
解决办法: 步骤1:开始-->所有程序-->Microsoft Visual Studio 2012-->Visual Studio Tools-->VS2012 开发人员命令 ...
- 【C#】ORM框架
ORM提供了实现持久化层的另一种模式,它采用映射元数据来描述对象关系的映射,使得ORM中间件能在任何一个应用的业务逻辑层和数据库层之间充当桥梁. Java典型的ORM框架有个:Hibernate,my ...
- JavaScript 判断 Undefined 类型
var cookiestr = ''; chrome.cookies.getAll( { 'url': 'https://mp.weixin.qq.com', 'secure': true }, fu ...