easyui下拉模糊搜索

2024-11-04

EasyUI combobox下拉列表实现搜索过滤（模糊匹配）

项目中的某个下拉列表长达200多个项,这么巨大的数量一个一个找眼镜都得看花,于是就得整了个搜索功能.看网上别人帖子有只能前缀匹配的方案,但只能前缀匹配的话用起来也不是很方便.于是就记录一下模糊匹配的方案. 实现效果: 这里使用的是combobox组合框,对于combobox的创建可以使用<input>输入框,也可以使用<select>下拉选.我使用的是<select>: HTML代码 <label>关联课程</label> <select

解决easyUI下拉控件无法触发onkeydown事件

实现在combotree下拉控件中按Backspace键清除combotree选中的值下面的代码无法获取到键盘事件 <input class="easyui-combotree" id="tt" name="tt" onkeydown="if(event.keyCode==8) clear()"/> 原因是easyUI重新定义了键盘事件,解决如下: $("#tt").combotree({ u

EasyUI下拉框级联

EasyUI用来实现后台界面还是可以的,毕竟面对的是小众群体而非广大的用户,简单为美.这里想聊的功能是一种下拉框的联动,比如我选中了下拉框A的某一项,那么下拉框B的选项就是甲乙丙丁,如果我选了A的另一项,那么B的选项就是ABCD,甚至不是一个下拉框了,而是一个文本框.直接看图吧: 这里的评测类型有3个选项: 当评测类型为“内部评测”时,评测人名称为一个邮箱地址当评测类型为外部评测时,评测人名称也是一个下拉框,选项包括:A9评测.tina.丽娜等当评测类型为邮件营销时,评测人名称还是一个下拉框

jQuery EasyUI 下拉菜单获取日期，最高年份为当前年份，最低年份为当前年份向前推10年

http://blog.csdn.net/wangjingjing1014/article/details/16885341 <head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>无标题文档</title></head><body> <select class="ea

Java easyui 下拉框默认选中第一个

html代码: <tr> <td> <div style="margin-bottom:5px">计价方式: <%--下拉框默认选中第一个--%> <input type="text" id="cvaluetypeID" class="easyui-combobox" name="name" data-options="valueField

easyui 下拉树改造

<select id="cc" style="width: 250px"></select> <div id="sp"> <div style="color: #99BBE8; background: #fafafa; padding: 5px;"> <input id="roleSearch" class="easyui-searchbox&

easyUI 下拉组件转义

<labelclass="label"for="belongWidget">归属组件:</label> <inputid="belongWidget"class="easyui-combobox"name="belongWidget"style="width:100px"data-options=" valueField:'id', textFie

easyui下拉框过滤优化

项目中有个需求:编辑combobox的输入域会自动检索匹配项,当没有任何匹配项时,将combobox重置为初始状态. 处理方式:重写输入域的blur事件,判断当前值是否为加载的数据集的子集,如果不是则重置. 脚本如下: $.fn.combobox.defaults.inputEvents.blur = function(e){ var target = e.data.target; var opts = $(target).combobox('options'); if (opts.revers

在easyui中如何修改combobox的下拉框的高度为自适应高度

在easyui中,有时候easyui下拉框的高度比较高,如果我们的值比较少,而下拉框的高度很高的话看起来不好看,修改前效果如下所示: 要修改下拉框的高度和我们的值自适应的话,只要添加一个panelHeight:"auto'属性就解决了,可以在data-options里面添加,也可以在easyui的js文件里面添加. 修改后效果如下所示:

easyui combobox点击输入框弹出下拉框

由于easyui combobox需要点击下拉箭头才能下拉,不能像select标签那样点击输入框就下拉,所以觉得不太方便,查看了一下,combobox弹出框是一个div,原本想在他的输入框的点击事件中触发div下拉,可是发现位置不好调整,特别是有多个combobox的时候,后来想到触发其下拉箭头的点击事件,查看一下,下拉箭头的标签使用span,就获取到这个元素,然后触发他的点击事件,结果就可以了.select标签下拉时,鼠标经过的项,其颜色是蓝色,与系统风格不一致,且UI要求是另外一种颜色,后来

easyui combotree下拉框多选赋值

发现jquery.easyui.min.js 1.3.4版本的用setValues给多选下拉框赋值不成功,只能用1.3.1版本的 Html代码: <input id="ProductLineId" name="ProductLineId" class="easyui-combotree" value="@(Model.ProductLineId == null ? Guid.Empty.ToString() : Model.Pro

easyui的combobox下拉框初始化默认值以及保持该值一直显示的方法

easyui的combobox下拉框默认初始值是空,下面是实现从远程加载数据之后初始化默认值,以及让该值一直排在下拉框的最顶部的方式. 目前的需求是需要在初始化的时候添加"全部数据库"字段,并且在下拉的时候,"全部数据库"一直排在最顶部. 初始化效果如下:

jquery easyui无法绑定下拉框内容

最近在研究jquery easyui的DataGrid,发现DataGrid中的下拉框无法绑定值,找了很久也没发现是具体问题所在,最后还是同事帮忙搞定的.具体问题竟然是jquery easyui提供的demo中的jquery版本有问题,还有就是绑定的json数据源要添加Method: "get"属性,要不然在C#中会有问题. 具体代码如下: <link rel="stylesheet" type="text/css" href="

easyui源码翻译1.32--Combo(自定义下拉框)

前言扩展自$.fn.validatebox.defaults.使用$.fn.combo.defaults重写默认值对象.下载该插件翻译源码自定义下拉框显示一个可编辑的文本框和下拉面板在html页面.这是构建其他复杂的组合部件(如:combobox,combotree,combogrid等)之前需要构建的最基本的组件依赖关系 validatebox panel 源码 /** * jQuery EasyUI 1.3.2 * *翻译:qq 1364386878 自定义下拉框 */ (functi

easyui源码翻译1.32--ComboTree（树形下拉框）

前言扩展自$.fn.combo.defaults和$.fn.tree.defaults.使用$.fn.combotree.defaults重写默认值对象.下载该插件翻译源码树形下拉框结合选择控件和下拉树控件.它与combobox(下拉列表框)类似,但是将下拉列表框的列表替换成了树形控件.该控件支持树状态复选框,方便多选操作依赖关系 combo tree 源码 /** * jQuery EasyUI 1.3.2 * *翻译: qq 1364386878 下拉树 */ (function ($

easyui源码翻译1.32--ComboGrid（数据表格下拉框）

前言扩展自$.fn.combo.defaults和$.fn.datagrid.defaults.使用$.fn.combogrid.defaults重写默认值对象.下载该插件翻译源码数据表格下拉框结合了可编辑文本框控件和下拉数据表格面板控件,该控件允许用户快速查找和选择,并且该控件提供了键盘导航支持,对行进行筛选源码 /** * jQuery EasyUI 1.3.2 * *翻译:qq 1364386878 下拉表格 */ (function ($) { function create(jq

easyui的combobox将得到的数据设定为下拉框默认值和复选框设定默认值

通过easyui做了一个表,表里是从数据库拿到的数据. 现在双击某一行,通过点击行的id取到这一行的所有数据,现在需要修改这些得到的数据, 其中部分数据是<select>这个选择的, 问题:当用户双击时,打开的页面的选择框的默认值是用户原先填写的 (现在页面直接通过${a.attr }能够拿到a类的attr属性值,现在就想把拿到的属性值设为默认值,并且还可以修改选择其它的). 原先使用的代码 (可以使用一个隐藏input[假定id为aa]得到value,再通过$("#status&q

实现在easyui中的datagrid，点击某一列的列头弹出combobox下拉框

easyUI datagrid在列头加下拉框,实现对列内容的筛选. 代码: onLoadSuccess: function (data) {//Fires when data is loaded successfully. typeFilt();//表头类型下拉框 $('#pp').pagination('refresh', { total: data.total, pageNumber: data.page }); toopTip(".downloadPic","下载&q

easyui combogrid下拉表格的分页/按键/动态搜索

作者:xfl4629712 < easyui combogrid下拉表格的分页/按键/动态搜索 > 需求: 1.下拉框下拉时出现表格: 2.表格带分页功能: 3.可以使用向上键.向下键在表格中移动选择行数据: 4.可以使用回车键在表格中选中行数据: 5.在下拉框的文本框中输入内容,能查询表格: 6.下拉框的文本框的内容变化时,表格数据按分页设置显示效果如下: 图1. 图2. 图3. 图4. 思路: 很简单,分拆为combo.datagrid.pagination三个组件分别操作,注意结

雷林鹏分享：jQuery EasyUI 表单 - 创建树形下拉框

jQuery EasyUI 表单 - 创建树形下拉框树形下拉框(ComboTree)是一个带有下列树形结构(Tree)的下拉框(ComboBox).它可以作为一个表单字段进行使用,可以提交给远程服务器. 在本教程中,我们将要创建一个注册表单,带有 name.address.city 字段.city 字段是一个树形下拉框(ComboTree)字段,在里面用户可以下拉树面板(tree panel),并选择一个特定的城市. 创建表单(Form) title="Register" butto

雷林鹏分享：jQuery EasyUI 表单 - 过滤下拉数据网格

jQuery EasyUI 表单 - 过滤下拉数据网格下拉数据网格(Combogrid)组件和下拉框(Combobox)组件的共同点是,除了都具有下拉面板以外,它们都是基于数据网格(Datagrid)的. 下拉数据网格(Combogrid)组件可以过滤.分页,并具有其他一些数据网格(Datagrid)的功能. 本教程向您展示如何在一个下拉数据网格(Combogrid)组件中过滤数据记录. 创建下拉数据网格(Combogrid) $('#cg').combogrid({ panelWidth:5

easyui下拉模糊搜索

热门专题