下拉框的搜索(有图,适用下拉选择内容较多,需要搜索,自动联想)

由于下拉菜单选项较多,需要在下拉菜单中加入搜索功能,而且具有搜索词联想功能。本文采用了select2.js插件,在引入后简单配置就可以使用

view中

AppAsset::register($this);
//引入select2插件实现下拉搜索功能
AppAsset::addScript($this,"js/plugins/select2-master/dist/js/select2.min.js");
AppAsset::addScript($this,"js/plugins/select2-master/dist/js/i18n/zh-CN.js");
AppAsset::addCss($this, "js/plugins/select2-master/dist/css/select2.min.css");
<div class="form-group " >
   <label class="control-label">指定业务员</label>
   <select class="form-control" name=‘employee_name‘ id="customer-uid">   //这里加入id
          <option value=‘0‘>所有业务员</option>
              <?php foreach ($employee_names as $k=>$v){
                 if(@$old["$employee_names"] == $v){
                     echo "<option value=‘{$k}‘ selected>{$v}</option>";
                 }else{
                     echo "<option value=‘{$k}‘>{$v}</option>";
                 }
                }
               ?>
    </select>
</div>
  <script>
        $(function(){
            $("#customer-uid").select2(); //使用
        })
 </script>
时间: 2024-10-08 20:50:03

下拉框的搜索(有图,适用下拉选择内容较多,需要搜索,自动联想)的相关文章

jsp下拉框中显示数据库信息&&jsp 下拉框从数据库中如何取值?

jsp下拉框中显示数据库信息 <select> <option value=0>-- 请选择 --</option> <% dao d=new dao();// 这是那个数据库访问的类. List list=d.getData(); for(int i=0;i<list.size();i++) { %> <option value=<%=i+1%>><%=list.get(i)%></option> &l

关于下拉框插件、或者框架的下拉框,初始化之后无法联动,或者再次绑定值问题

我用的Bootstrap4的ubold 框架 ,他的下拉框第一次初始化之后,再次初始化,就不在赋值了. 第一步,我审查了元素, 下拉框是没有花里胡哨的样式的,基本上美化下拉框是根据返回的select 数据 生成一个ul li 然后把生成的元素重新赋值. 根据我多次测试和操作,个人分析,造成第二次不绑定数据的原因是:那个初始化方法只会给未生成的元素初始样式,已有的就不会再次初始样式了.(有些框架不会,但是有些会这样) 第二步,根据原因解决(原则上来说,为达目的不择手段) 1.可以把他写的JS找到,

.NET下拉框DropDownList层级实现

.NET下拉框DropDownList层级实现 这也算是第一篇博客吧,技术比较菜,写得不好,希望各位博友见谅哈,多多提提意见. 今天做电商网站新闻添加的时候,下拉框选择新闻类别觉得太长,又无法定位其准确级别,让人甚是苦恼,于是想做一个层级的下拉框,刚开始的时候想到了用递归树去实现,之前写过递归树,觉得应该可以,便试了一下,递归树代码如下: 1 #region 递归添加下拉框的值 参数ParentID为树的最大父结点 2 public void AddTree(int ParentID, List

DevExpress gridview下拉框的再次研究

前几天写了一篇关于研究DevExpress gridview下拉框的随笔(DevExpress gridview下拉框repositoryItemComboBox的使用),被大神(@爱编程的大叔)评论为:成功用世界上最繁琐的方法来使用Devexpress中的Gridview控件中的下拉框,之后就一直在想那肯定是还有更加简便的办法,刚好今天有空闲时间,就去了官网研究起了gridControl的属性(https://documentation.devexpress.com/#WindowsForms

TW自动化测试下拉框遇到的问题及解决方法

今天,分享下使用自动化测试工具TestWriter测试下拉框时遇到的一些问题及解决方法,欢迎大家一起讨论交流~ 问题1:web测试 1.xpath路径获取正确2.操作的事件为 :comboboxselectbyindex .数据来源为常量3.选中项为 :3 4.回放的时候,报错提示 : 下拉框选中出错 解答:针对下拉框元素操作时,请先确认该下拉控件的实现方式,从前端开发角度来讲,要么使用html原生的Select标签,要么自定义.如果使用的原生标签,则可以使用comboboxselectbyin

多个select下拉框,选中当前某一项,其他下拉框去掉选中的值

前两天在项目开发的时候有个需求是要求多个下拉框,选中某一项后其他下拉框移除该项,虽然写的有点绕,如果那个小伙伴有更好的例子,可以贡献下.先贴几张图看下效果 这是全部下拉框展开的效果图,具体描述看图吧,下面就开始贴代码 html部分 <div class="video_in"> <p> 下拉一 <select name="B1other1_1" id='B1other1_1' class="select"> &l

Struts2 &lt;s:doubleselect&gt;级联下拉框 详解析

运行环境:myeclipse8.6+jboss5.1+jvm1.6 先看最后目录结构: 直接上源码: complexFormTag.jsp: <%@ page language="java" contentType="text/html; charset=gb2312"pageEncoding="gb2312"%> <%@ taglib prefix="s" uri="/struts-tags&qu

Selenium2+python自动化15-select下拉框

前言 最近由于工作原因,更新慢了一点,今天终于抽出一点时间给大家继续更新selenium系列,学习的脚本不能停止,希望小伙伴能多多支持. 本篇以百度设置下拉选项框为案例,详细介绍select下拉框相关的操作方法. 一.认识select    1.打开百度-设置-搜索设置界面,如下图所示 2.箭头所指位置,就是select选项框,打开页面元素定位,下方红色框框区域,可以看到select标签属性: <select id="nr" name="NR">   

优化jeecg底层高级查询,支持bool值和下拉框查询

最近在用jeecg做项目,在使用高级查询的时候发现它不支持布尔值的查询以及列表的下拉框的查询,所以小编修改了底层代码,完善了高级查询,现在与大家一起分享.先上一张图给大家看一下修改前的高级查询. 它只支持了文本的查询以及日期格式的查询,很难满足在使用过程中的要求.所以小编把他的功能丰富了一下,下面把源码分享给大家. 首先先简单介绍一下jeecg高级查询的原理,一切的秘密都在DataGridTag这个标签类里面,在打开一个页面的时候,这个类会对页面的左右变迁进行初始化,以及对高级查询的页面进行构造

最近遇到一个很纠结的问题:jquery.autocomplete在IE6下被下拉框遮挡 。

最近遇到一个很纠结的问题:jquery.autocomplete在IE6下被下拉框遮挡 . 如图: 网上找到原因,例如:http://www.360doc.com/content/10/1126/16/2197500_72641076.shtml 但是,我们的问题是我们用了jquery.autocomplete这个控件,这些方法对于我们就不行了. 废话多了,直接解决方法: 第一步:打开jquery.autocomplete.min.js(或者直接jquery.autocomplete.js),找