yii2框架中使用下拉菜单的自动搜索yii-widget-select2实例分析
本文实例讲述了yii2框架中使用下拉菜单的自动搜索yii-widget-select2的方法。分享给大家供大家参考,具体如下:
github中源代码地址:https://github.com/kartik-v/yii2-widget-select2
利用composer.phar安装此插件:
php composer.phar require kartik-v/yii2-widget-select2 "*"
引用方法:
use kartik\select2\Select2;
源代码:
<?= $form->field($model, 'companies_company_id')->widget(Select2::classname(), [ 'data' => ArrayHelper::map(Companies::find()->all(),'company_id','company_name'), 'language' => 'en', 'options' => ['placeholder' => 'Select a state ...'], 'pluginOptions' => [ 'allowClear' => true ], ]); ?>
相关内容的详细解释:http://demos.krajee.com/widget-details/select2
希望本文所述对大家基于Yii框架的PHP程序设计有所帮助。
相关推荐
-
JS组件Bootstrap Select2使用方法详解
在介绍select组件的时候,之前分享过一篇JS组件中bootstrap multiselect两大组件较量的文章,这两个组件的功能确实很强大,本文分享下select组件的一些用法和特性. 一些通用的单选.多选.分组等功能这里就不多做介绍了,multiselect这方面是强项.重点介绍下select2的一些特性效果: 一.特性效果 1.多选效果 可以设置最多只能选几个 2.图文结合的效果 3.远程搜索功能(即在用户输入搜索内容时动态去后台取数据) 输入内容前 输入空格搜索出全部 滚动条滑动到底部
-
Extjs中ComboBoxTree实现的下拉框树效果(自写)
最近涉及到的一个项目中,需要实现ComboBoxTree的效果,首先,看看效果吧-- 在Extjs中是没有这种效果的,所以得自己写,在网络上看了看别人的资料,自己再总结了一下,修改了一下,代码如下: 复制代码 代码如下: Ext.ux.TreeCombo = Ext.extend(Ext.form.ComboBox, { constructor: function (cfg) { cfg = cfg || {}; Ext.ux.TreeCombo.superclass.constructor.
-
js和jquery分别验证单选框、复选框、下拉框
本文分别介绍了js和jQuery验证单选框(radio).多选框(checkbox).下拉框(select),分享给大家供大家参考,具体内容如下 (1).首先说单选框(radio),radio和checkbox一样都是name相同值有多个在获取 radio 值的时候我们不能按照普通文本框.value的方式,而是要判断哪个被选中了. js验证是要用getElementsByName()获取数组 js代码如下: <script> function test(){ var sex = documen
-
js实现带搜索功能的下拉框实时搜索实时匹配
1. 当select输入框中每输入一点内容的时候,在option中找出与内容匹配的选项显示在option的前面选项中. 2. 如何获取每次输入的内容,当keyup的时候触发函数. 问题:select标签中可以输入内容吗?(解决:另一篇文章可选择和输入的下拉列表框 ) 3. 如何获得输入框中的内容?(解决,在输入框上添加onkeyup时间触发的函数用js获得) 4. 如何匹配?(解决) 4.1 如何获得所有option中的内容?(解决) 复制代码 代码如下: function getSelectT
-
jquery及原生js获取select下拉框选中的值示例
现在有一id=test的下拉框,怎么拿到选中的那个值呢? 分别使用javascript原生的方法和jquery方法 复制代码 代码如下: <select id="test" name=""> <option value="1">text1</option> <option value="2">text2</option> </select> 一:javas
-
javascript中select下拉框的用法总结
本文针对开发项目中遇到的问题,进行了汇总 问题1:如何选择select的option里面的值? 首先会用到一个方法 onchange():这个方法主要用于触发,选择框内容改变时间 实现代码: <!doctype html> <html> <head lang="en"> <meta charset="UTF-8"> </head> <body> <select onchange="
-
JS组件Bootstrap Select2使用方法解析
本文总结了组件Bootstrap Select2在一些实际项目中的用法,分享给大家,有需要的朋友可以借鉴一下,少走些弯路,具体内容如下 效果图: 无论是固定方式获取数据还是ajax获取都需要引入bootstrap.js/css 和 select2.js/css及: {{ stylesheet_link('css/bootstrap.css') }} {{ stylesheet_link('css/select2.min.css') }} {{ stylesheet_link('css/font-
-
javascript省市区三级联动下拉框菜单实例演示
本文实例讲述了javascript实现省市区三级联动下拉框菜单代码,像平时购物选择地址时一样,通过选择的省动态加载城市列表,通过选择的城市动态加载县区列表,从而可以实现省市县的三级联动,下面使用原生的JavaScript来实现这个功能,分享给大家供大家参考.具体如下: 运行效果截图如下: 具体代码如下: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"
-
javascript实现省市区三级联动下拉框菜单
本文实例讲述了javascript实现省市区三级联动下拉框菜单代码.分享给大家供大家参考.具体如下: 运行效果截图如下: 首先写一个静态的页面: <!DOCTYPE html> <html> <head> <title>QQ JS省市区三级联动</title> <!-- 使用QQ的省市区数据 --> <!-- <script type="text/javascript" src="http:/
-
Select2.js下拉框使用小结
用了这么久的Select2插件,也该写篇文章总结总结.当初感觉Select2不是特别好用,但又找不到比它更好的下拉框插件. 在我的印象里Select2有2个版本,最新版本有一些新的特性,并且更新了一下方法参数,比最初版本要好看一些,本文针对新版本. 官网:http://select2.github.io/ 演示: 由于博客系统的原因,所以只能演示简单的功能. 一.文件需要引入select2.full.js.select2.min.css(4.0.1版本)和jquery.1.8.3及以上 最新版本
随机推荐
- 详解使用Docker容器来源码编译etcd
- UUencode 编码,UU编码介绍、UUencode编码转换原理与算法
- jquery+ashx无刷新GridView数据显示插件(实现分页、排序、过滤功能)
- Apache Shiro 框架简介
- setTimeout的延时为0时多个浏览器的区别
- ASP.NET Core 数据保护(Data Protection)中篇
- php多层数组与对象的转换实例代码
- 使用PHP遍历文件夹与子目录的函数代码
- C#中重载相等(==)运算符示例
- 如何使用表单发送电子邮件?
- Web Safe Color Pallette
- jQuery实现冻结表格行和列
- jquery操作下拉列表、文本框、复选框、单选框集合(收藏)
- Javascript 表格操作实现代码
- 从源码编译Android系统的Java类库和JNI动态库的方法
- java数据库连接池和数据库连接示例
- C语言 数据结构中栈的实现代码
- php类
- VC实现让关闭按钮成灰色不可用的方法
- 浅谈c#表达式树Expression简单类型比较demo