使用select多选标签笔记
之前一直用checkbox做多选,其实 select也可以多选,只要多给一个属性即可。标签属性 http://www.w3school.com.cn/tags/att_select_multiple.asp
然后效果上可以多选,连选,反选(按下Ctrl 使用鼠标单击)等功能。
YII框架自带了这种标签的生成方法,即著名的小物件。调用代码如下
$form->field($model, 'type')->dropDownList($list,array('size'=>5,'multiple'=>'multiple'))->label(false);
这样就能把属性或者样式等传参传进去,然后生成的效果是
<select id="user-type" class="form-control" name="select_val[]" multiple="multiple" size="5">
<option value="1">test</option>
<option value="2">test2</option>
</select>
然后就可以多选了,当你选择多个以后,使用jquery获取选中的值的时候 会得到一个数组。例如 $("#标签id").val() 得到一个数组 ["1", "2"]
然后当你想反向绑定,通过获取的多个值,让select选中的话 可以这样赋值 $("#标签id").val(["1", "2"]);即可
使用select多选标签笔记的更多相关文章
- 火狐下<a>标签里嵌套的<select>不能选的bug
今天遇到了这个问题,网上一找就找到原因了:在狐火下<a>标签里嵌套的<select>不能选 可是我查找这个问题过程中依然饶了一些时间,原因是在<a>标签没有写hre ...
- [RN] React Native 实现 多选标签
React Native 实现 多选标签 效果如下: 实现代码: import React, {Component} from 'react'; import {Button, StyleSheet, ...
- 工作需求----表单select多选交互
由于工作需求接触select框多选的情况,以下是我分享的代码,主要是进入页面默认选中.支持多选属性: 1.html内容 multiple=”multiple” 属性为多选属性 <div clas ...
- JS 获取select(多选下拉)中所选值的示例代码
通过js获取select(多选下拉)中所选值,具体实现如下,有需要的朋友可以参考下,希望对大家有所帮助 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML ...
- js之全选即点击全选标签可选择全部复选框
目标效果:网页全选功能,即点击全选标签可选择全部复选框 实现代码如下 <!DOCTYPE html> <html lang="en"> <head&g ...
- 在ASP.NET MVC中实现Select多选
我们知道,在ASP.NET MVC中实现多选Select的话,使用Html.ListBoxFor或Html.ListBox方法就可以.在实际应用中,到底该如何设计View Model, 控制器如何接收 ...
- select多选框
select多选框 效果: 代码: <HTML> <HEAD> <TITLE>选择下拉菜单</TITLE> <meta http-equiv=&q ...
- vue结合element-ui 的select 全选问题
下拉列表多选 问题 通过操作 所有来进行全选 全不选问题 element-ui 中 select 记录下自己最近使用element-ui 中的 select多选问题 在element中默认是指单纯多选 ...
- select多选
1.css <style> .divBox{ width:400px; margin:100px auto; } .divBox span{ vertical-align:top; dis ...
随机推荐
- Oracle_字符集问题(数据库与客户端字符集关联关系)
http://blog.163.com/jiankun_liu/blog/static/1863927762013698175289 ********************************* ...
- 【转】Hive SQL的编译过程
Hive是基于Hadoop的一个数据仓库系统,在各大公司都有广泛的应用.美团数据仓库也是基于Hive搭建,每天执行近万次的Hive ETL计算流程,负责每天数百GB的数据存储和分析.Hive的稳定性和 ...
- 如何在Windows Server 2008 R2下搭建FTP服务
在Windows Server 2008 R2下搭建FTP服务,供客户端读取和上传文件 百度经验:jingyan.baidu.com 工具/原料 Windows Server 2008 R2 百度经验 ...
- Clipboard获取内容C#
一.获取文本 textBox1.Text = Clipboard.GetData("Text").ToString(); 二.获取图像 pictureBo ...
- thrift学习之一-------介绍
thrift 官网: http://thrift.apache.org/ Thrift是一个软件框架,用于支持可扩展的跨语言服务的开发,它无缝的与C++,Java,Python,PHP,Ruby,E ...
- Winform RsaProtectedConfigurationProvider 加密数据库连接字符串
private static string _strProvider = "RsaProtectedConfigurationProvider"; /// <summary& ...
- android——inflater 用法(转)
在实际开发中LayoutInflater这个类还是非常有用的,它的作用类似于findViewById().不同点是LayoutInflater是用来找res/layout/下的xml布局文件,并且实例 ...
- JAVA的包装类2 【转】
怎么理解JAVA中的“包装类” JAVA是一种面向对象语言,java中的类把方法与数据连接在一起,构成了自包含式的处理单元.但在JAVA中不能定义基本类型(primitive type)对象,为了能 ...
- CentOS安装redmine 2后的简单配置
CentOS5.4安装redmine详细步骤 http://blog.csdn.net/leekwen/article/details/8516832 <<<<输出日志的配置& ...
- 上传图片(示列分析) $_FILES
新建一个think_photo数据库,库里用sql CREATE TABLE IF NOT EXISTS `think_photo` ( `id` ) NOT NULL AUTO_INCREMENT, ...