关于easyui中的combogrid keyHanlder属性使用的问题(filter改进)

重写Easy UI的datagrid的内嵌combobox datebox combogrid键盘事件keyhandler(方向键和tab键) 以下为代码 重写combobox的键盘事件keyhandler let editField = undefined; let editGrid = undefined; let editIndex = undefined; let clickRow = null; /** * 重写combobox的keyhandler键盘事件,下面方法类似 */ $.extend($.fn.combobox.defaults.keyHandler, { enter: function () { 阅读详情

今天工作中使用 easyui combogrid插件遇到的问题,记录下,


使用场景:

1、 支持键盘上下箭给文本域赋值,回车发送请求(焦点在文本域)

2、点击列表选项发送请求

3、输入框输入文字时只显示匹配的记录


尝试实现方式:

1.使用OnSelect事件,通过判断 event.keyCode 处理,chrome,ie有效 ,Firefox没有 window.event 对象,所以无效

$('#cg').combogrid({
    onSelect:function(index,row){
          if (event){
			   if (event.keyCode == "13" || event.keyCode == "0"){  //回车或点击列表选择
			        alert("test");
			   }
		  }
    }
});

1.使用keyHandler属性,如果只实现 enter 函数,使用键盘上下键会报如下错误:


实现空的up/down函数或者null,空的函数会覆盖combogrid 的默认行为,使键盘上下键失去上下滚动选中赋值效果,null 则会报错(query没实现,文本框输入时会报错)




最终方案:

(function($){
	var oldLoadDataMethod = $.fn.datagrid.methods.loadData;
	$.fn.datagrid.methods.loadData = function(jq, data){
		jq.each(function(){
			$.data(this, 'datagrid').filterSource = null;
		});
		return oldLoadDataMethod.call($.fn.datagrid.methods, jq, data);
	};	
});

var combo = combo || {};
combo.clear =function(obj){
	if($(obj).combogrid()){
		$(obj).combogrid("clear");
		var _grid=$(obj).combogrid('grid');
		if(_grid && _grid.datagrid("getRows").length){
			_grid.datagrid('loadData', {total:0,rows:[]});
		}
	}
};
combo.filter=function(obj,fields){
	var value=obj.textbox("getText");
	var state=obj.combogrid('grid');
	var data = state.datagrid('getData');
	if ($.isArray(data)){
		data = {
			total: data.length,
			rows: data
		};
	}
	if (!state.filterSource){
		state.filterSource = data;
	}
	data = $.extend({}, state.filterSource);
	var rows = [];
	for(var i=0; i<data.rows.length; i++){
		var row = data.rows[i];
		if (isMatch(row)){
			rows.push(row);
		}
	}
	data = {
		total: data.total - (data.rows.length - rows.length),
		rows: rows
	};
	state.datagrid("loadData",data);
	if(data.total>0 && value!=""){
		state.datagrid("selectRow",0);
	}
	function isMatch(row){
		for(var i=0;i<fields.length;i++){
			var source = row[fields[i]];
			if (source){
				if(source.toLowerCase().indexOf(value.toLowerCase())>=0){
					return true;
				}
			}
		}
		return false;
	}
}



    
    //定义实验室combogrid
    $('#laboratoryComboGridChart').combogrid({
        panelWidth: 400,
        width: 190,
        idField: 'id',
        mode:'local',
        textField: 'name',
        columns: [qcra.labTmpl],
        fitColumns: true,
        onLoadSuccess:function(data){
            //非默认加载
            if($('#laboratoryComboGridChart').combogrid('grid').filterSource){
        	 return false;
            }
	    if ($('#audit_labId').val()!=""){
	     	 //选中默认仪器
	     	 $ ('#laboratoryComboGridChart').combogrid ('setValue', $('#audit_labId').val());
	     	 //加载默认实验室下仪器combogrid
	     	 findInstrumentsByLabId($('#audit_labId').val());
	     	 $("#audit_labId").remove();
	    }else{
	     	 $ ('#laboratoryComboGridChart').combogrid ('setValue', '${labId}');
	     	 //加载默认实验室下仪器combogrid
	     	 findInstrumentsByLabId('${labId}');
	    }
       		
        },
      	onClickRow: function(index,row){
      		//加载实验室下仪器
      		findInstrumentsByLabId(row.id);
      	}
    });
    var timer=null;
    var labGrid=$('#laboratoryComboGridChart');
    labGrid.textbox('textbox').bind('keyup', function(e){
        //输入时延时0.4秒
        if(timer){
	    clearTimeout(timer);
	}
   	timer=setTimeout(function(){
   	    combo.filter($('#laboratoryComboGridChart'),['name','code']);
   	},400);
    	if (e.keyCode == 13){
    		var row=labGrid.combogrid('grid').datagrid('getSelected');
    		findInstrumentsByLabId(row.id);
    	}
    });
    //查询实验室
   function findLaboratorys(){
    	$.getJSON('${ctx}/qcra/findLaboratorys.action',function(data){
    		$('#laboratoryComboGridChart').combogrid('grid').datagrid('loadData',data);
    	});
   }
easyui combogrid onChanage 问题 easyui combogrid onChanage 输入中文的问题. 这里大家也可以讨论一下   就是输入中文的时候就触发了. 可不可以完全输入中文在触发.  方案: 1.延迟   -不行因为你不知道什么时候输入完成.             2.触发空格键触发               3.回车键触发.       4.失去焦点触发.            5.判断输入的是否为中 阅读详情

相关推荐

easyui datagrid 行编辑中combogrid和combobox显示问题

修改上一个资源版本中结束编辑时combobox显示问题. 1、类型为combogrid时每行的参数不同查询返回对应的数据结果。 2、类型为combobox时,输入框显示图标按钮,实现对应的事件。 3、解决类型为combobox显示为value而不是text问题

easyui combobox keyhandler使用

easyui combobox keyhandler使用 在combo组件中有属性:   keyHandler : { up : function() { console.log('upupup'); }, down: function(){console.log('down');}, ...

weixin_33866037的博客 3367

easyui combogrid实现本地模糊搜索过滤多列

本篇文章主要介绍了easyui combogrid实现本地模糊搜索过滤多列,非常具有实用价值,需要的朋友可以参考下

jQuery EasyUI Combobox无法检索中文输入的问题

jQuery EasyUI Combobox无法检索中文输入的问题,这个问题在网上搜的解决方案是基本都是在 if(..editable){...}这个里面写一个定时器setTimeout,取输入的值,然后触发显示匹配的下拉框数据。 这个在ie、谷歌浏览器上可以正常显示。我这边在火狐浏览器不行。 比如: 我输入一个中文汉字"你"。 在ie、谷歌,定时器取了2次值,分别是"ni"、"你...

wanghuan_em的博客 938

把MinerU集成到Dify

本文介绍了如何将本地部署的MinerU与Dify平台进行集成。首先需要确保Dify和MinerU在Docker环境中正常运行,并通过配置虚拟网络实现互联。然后详细说明了在Dify平台安装MinerU插件的步骤,包括从插件市场搜索安装、配置连接参数等关键操作。特别强调了要等待MinerU容器完全启动(healthy状态)后再进行Dify配置,否则会出现连接错误。通过简单的URL指向和API密钥设置,用户即可实现Dify平台与本地MinerU算力网络的对接,为后续的AI应用开发提供基础支持。

lyxerlau的博客 314

PDBfixer:蛋白质结构修复工具

本文介绍蛋白质数据银行(PDB)文件常见问题及修复工具PDBFixer的使用方法。PDB文件常存在缺失原子、残基等问题,PDBFixer可通过GUI、命令行或Python API实现自动化修复。文章详细说明安装方法、命令行参数、Python脚本修复流程及非标准残基替换表,并与Modeller、ColabFold和Rosetta Remodel等其他修复工具进行对比分析,提供了各工具的特点、适用场景和典型计算时间比较,帮助用户根据具体需求选择合适的修复工具。

Protein Designer的博客 612

ComboGrid中快捷键Enter使用

【代码】ComboGrid中快捷键Enter使用。

u013059089的博客 429

2026年1至9月武汉市房地产价格深度分析报告

本报告基于2026年1月至9月武汉市实际成交案例,从成交价格、区域分布、户型结构、价格走势等维度进行深度分析。数据来源包括武汉市住房保障和房屋管理局备案数据、主要中介机构成交记录及典型楼盘网签案例,覆盖全市15个行政区及主要功能板块。

王国平的博客 333

EASYUI 1.4版 combobox firefox 下不支持中文检索的问题

easyui 的combobox 在IE下面输入中文,可以自动实现筛选和检索的功能,但是在firefox下面不可以。 于是查了一些资料,发现原来是浏览器对于中文输入法的处理问题,对于chrome 和 IE 他们会响应输入法最后输入中文时的keydown事件,也就是说如果你输入"调" 这个字,如果用的拼音输入法,你按下 diao 四个字符的时候,IE不会处理keydown事件,只有当"调"这个字进入...

weixin_30699463的博客 175

YOLO26-seg分割优化:卷积魔改 | 动态蛇形卷积(Dynamic Snake Convolution),实现暴力涨点 | ICCV2023

​​​​​​摘要:本研究对Ultralytics YOLO26进行了全面分析,重点阐述了其关键架构改进及其在实时边缘目标检测中的性能基准测试。YOLO26于2025年9月发布,是YOLO系列最新、最先进的成员,专为在边缘及低功耗设备上实现高效、精确且易于部署的目标而构建。本文依次详述了YOLO26的架构创新,包括:移除了分布焦点损失(DFL);采用端到端的无NMS推理;集成了渐进损失(ProgLoss)与小目标感知标签分配(STAL);以及引入了用于稳定收敛的MuSGD优化器。

①答疑群聊服务;②YOLO大模型知识问答系统;③计算机视觉论文生成智能体; 217

YOLO26 vs YOLOv12 vs YOLOv10:工业场景性能实测,速度/精度/部署难度全对比(附完整测试代码)

YOLO26:工业场景全能型选手,无NMS+无DFL设计让部署和推理都省心,小目标精度优势明显,CPU推理速度提升43%,适合大多数生产线场景YOLOv12:中大型目标检测专家,Area Attention在复杂背景下表现出色,适合汽车、家电等大型零部件检测YOLOv10:速度狂魔,GPU上性能领先,轻量化版本适合边缘部署,但小目标精度略逊,适合对实时性要求极高的分拣线场景。

专注于Python爬虫开发,分享爬虫技巧、项目实战与反爬经验,使用Scrapy、BeautifulSoup等工具,解决数据抓取难题。 625

easyUI中combobox中中文不支持的问题

做一个实现在easyui-combobox组件中 进行中文输入实现后台查询的功能时遇见的BUG easyui中combobox组件,在使用下拉框时, 调用改插件的mode:remote 方法时 该组件默认检测的时英文输入状态下的字符输入  也就是键盘上的keydown的事件  所以当要想输入中文进行查询时 在输入中文时 并不会触发keydown事件 此时点击shift按键 就会触发k

gongchenggou的博客 2057

Qt实现思维导图功能5『纵向分布模式』

思维导图纵向分布模式:模式一

浮生流年的博客 1062

JQuery easyUI combobox 数据过滤(filter)

1、jsp/js文件:      data-options="      panelWidth:550,      value:'${order.saleMan.id }',      idField:'id',     textField:'userName',      pagination:true,     required:true,      edi

Shan_mei的专栏 1万+

MinerU 本地部署完整指南:从零构建你的私有文档智能处理系统

摘要: MinerU是一款开源本地化文档解析工具,可将PDF、Word等文件智能转换为结构化Markdown,保留表格、公式、图片等元素。其核心优势包括: 隐私安全:完全离线处理,避免云端数据泄露风险; 高精度解析:基于深度学习还原文档逻辑结构,支持多格式输入; 易集成:提供RESTful API,适合金融、医疗等敏感场景。部署需Python 3.9+环境,支持CPU/GPU运行,推荐配置16GB内存及NVIDIA显卡。通过命令行或Docker即可快速启动,适用于知识库构建、RAG系统预处理等。

reset2021的博客 752

OV9734 DATASHEET,完整规格书

OV9734完整规格书,包括电气参数,尺寸规格,寄存器配置表等

EasyUI Combogrid的使用

1、简单Combogrid的使用 1.1表单: columns:[[{field:'academyCode',title:'院校代码',width:80},{field:'academyName',title:'院校名称',width:130},{field:'provinceName',title:'所属地区',width:70}]]" class="easyui-combogrid

xxxxx 4926

VC中sqlite的使用

在VC中对sqlite的使用,实现数据库大批数据的快速插入,读取数据库中的数据在ListCtrl中显示

Vue-easyui ComboGrid 输入是过滤下拉框中的数据

Vue-easyui ComboGrid 输入是过滤下拉框中的数据 找了一些实例没有实现我的要求,就硬着头皮根据官方文档,实例看了下载的模块代码,最后终于实现了,不知道有没有其他的影响 1.ComboGrid 设置为可输入的(editable=“true” ),文本框中输入的为过滤值(filterValue),添加过滤值更改事件的函数(filterChange),使用ref标识 <ComboGrid :valueField="coset[item.column_name]['录入值列']" :text

qq_41863865的博客 724

STM32F407中文手册

STM32f407中文手册 本参考手册面向应用开发人员,提供有关使用 STM32F405xx/07xx、STM32F415xx/17xx、 STM32F42xxx 和 STM32F43xxx 微控制器存储器与外设的完整信息。STM32F405xx/07xx、STM32F415xx/17xx、STM32F42xxx 和 STM32F43xxx 构成一个微 控制器系列,各产品具有不同的存储器大小、封装和外设。有关订购信息以及器件的机械与电气特性,请参见数据手册。有关 ARM Cortex™-M4F 内核的信息,请参见《Cortex™-M4F 技术参考手册》。

蓝牙模块HM-10手册

蓝牙模块HM-10手册,该手册对蓝牙模块HM-10进行了详细的介绍和使用方法以及一些AT指令。

Jquery EasyUI使用ComboGrid

1.1 实现功能: 1、combogrid完成开发,可以进行排序,和过滤查询数据; 2、解决排序和索引越界问题; 3、比较字符串使用equals方法,内部循环边界值要小于数组长度-1 4、创建时间显示出来了。 之前不显示是因为前台字段和后台返回字段差一个字母。 5、简化属性复制,采用框架自带类 1.2 界面效果:

cyberzhaohy的专栏 6377

easyui combogrid 多选加载,保存,显示代码

1.调用代码 UTIL.SetDict($("#txt_ExcludeIndustry_"), "SECTOR_TYPE", true, true, function () { var objects = $("#txt_ExcludeIndustry_").val(); if (objects != "") { ...

weixin_34255055的博客 1190

easyui的combobox/combogrid检索

combobox默认的是从第一个字开始检索,输入关键字检索不到 所以要修改默认配置才可以关键字检索 只要在js文件中加入这段 重写默认过滤器 这是combobox $.fn.combobox.defaults.filter = function(q, row){ var opts = $(this).combobox('options'); return row[opts.te...

weixin_30781433的博客 342

easyui-combogrid需求

easyui-combogrid <tr height="35px;"> <td width="25%" height="35px;" align="right">产品名称:</td> <td width="75%" align="left"> <select id="cc" class="easyui-combogrid" name="productName" style="width:90%;" onkeydown="if(event.ke

凌枫ozo的博客 429

关于EasyUi中combo输入框搜索功能异常问题

问题 关于EasyUi中combo(combobox,combotree,combogrid)系列输入框搜索功能异常问题 下拉列表明显有对应值,却搜索不到,控制台报错 问题展示 报错 问题分析 控制台报错,跟踪得到下拉选择框第一值为空,导致row为空报错 这是正常情况下的,row为下拉选择框数据(后台传递到前台的) 解决方法 准备数据时排除掉为null的数据 ...

小白的自我摸索之路 1096

实现easyui的combogrid模糊查询框

这里用的方法是一个不可编辑的combogrid控件,覆盖上一个可输入的Input控件。 思路:   1、初始时取到后台查询出的列表,存储到全局变量   2、当输入框输入内容时,循环匹配列表,重新绑定到combogrid HTML代码 <input id="receiveName" name="receiveName" class="easyui-combogrid" style...

weixin_30718391的博客 740

EasyUI datagrid回车下一个

--------------------------------------------------------------调用------------------------------------------------------------------ //开始编辑行时,赋值 联动数据         function onBeginEdit(rowIndex, rowData) {

foreverhot1019的博客 3956
上一篇: Eclipse 中报Unhandled event loop exception Java heap space(如果是JS导致的)解决方案
下一篇: Memcached 常见的问题
booth.chen
博客等级 码龄17年 63粉丝 22原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值