jquery easyui combobox 级联及触发事件,combobox级联
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>.
蕃薯耀 2016年12月29日 09:02:09 星期四
http://fanshuyao.iteye.com/
一、级联的代码:
$("#drawCode").combobox({ onChange : function(newValue, oldValue){ if(isEmpty(newValue)){ $('#repayPalnCodePrincipal').combobox("loadData", []); $('#repayPalnCodeInterest').combobox("loadData", []); }else{ $('#repayPalnCodePrincipal').combobox({ url : basePath + '/getListDrawRepayPaln?repayType=1&drawId='+newValue, valueField : 'repayPalnId', textField : 'repayPalnCode', onLoadSuccess : function(){ var repayPalnId = "${paymentDraw.repayPalnId}"; if(!isEmpty(repayPalnId)){ $(this).combobox("setValue", repayPalnId); } } }); $('#repayPalnCodeInterest').combobox({ url : basePath + '/getListDrawRepayPaln?repayType=2&drawId='+newValue, valueField : 'repayPalnId', textField : 'repayPalnCode', onLoadSuccess : function(){ var repayPalnId = "${paymentDraw.repayPalnId}"; if(!isEmpty(repayPalnId)){ $(this).combobox("setValue", repayPalnId); } } }); } } });
二、jquery combobox中如何触发onchange事件呢?
jquery使用$("#xxxx").change();可以主动触发onchange事件,但在easyui不行。
经过测试,可以通过赋值触发easyui的onchange事件,如下:
$("#drawCode").combobox("setValue", '${paymentDraw.drawId}');
需要注意的是:不能在combobox中的data-options直接加上value:‘xxxxx’直接赋值,这样是不会触发onchange事件的。
第二个combobox加载完赋值是通过onLoadSuccess事件的:
$('#repayPalnCodePrincipal').combobox({ url : basePath + '/getListDrawRepayPaln?repayType=1&drawId='+newValue, valueField : 'repayPalnId', textField : 'repayPalnCode', onLoadSuccess : function(){ var repayPalnId = "${paymentDraw.repayPalnId}"; if(!isEmpty(repayPalnId)){ $(this).combobox("setValue", repayPalnId); } } });
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>.
蕃薯耀 2016年12月29日 09:02:09 星期四
http://fanshuyao.iteye.com/
相关推荐
以下将详细介绍如何使用jQuery EasyUI的Combobox实现级联功能,并结合Java后端处理JSON数据。 首先,理解jQuery EasyUI Combobox的基本用法。Combobox组件在HTML中表现为一个输入框和一个下拉列表,通过JavaScript...
当用户在第一级combobox中选择一个值时,触发该事件,此时可以获取到所选值并根据这个值动态更新第二级combobox的`url`,然后调用`reload`方法重新加载数据。这样,第二级combobox的选项就会基于第一级的选择进行...
总结来说,EasyUI的Combobox级联下拉列表实现的关键在于JavaScript的事件监听和数据加载。通过AJAX请求获取数据,结合EasyUI的Combobox组件特性,我们可以创建出灵活且互动的级联选择界面,这对于多层分类或层次化...
### easyui的datagrid中editor和combobox的级联 在前端开发中,easyui是一个非常实用的库,它提供了一套完整的用户界面组件,能够帮助开发者快速构建出功能丰富的Web应用。其中,`datagrid`是easyui提供的一个重要...
- 当第一个 `combobox`(省份)的值改变时,通过 `onChange` 事件触发 AJAX 请求。 - 请求的参数是新选择的省份 ID,即 `parentid:newValue`。 - 请求返回的数据应该是市区列表,格式化为 `combobox` 可以理解的 ...
jQuery EasyUI 是一个基于 jQuery 的前端框架,它提供了一系列易于使用的组件,用于快速构建用户界面。1.4.2 版本是这个框架的一个稳定版本,包含了许多改进和修复,以提升开发者的体验和应用程序的性能。这个压缩包...
在本文中,我们将深入探讨jQueryEasyUI的核心概念、主要组件以及与Java的集成方式。 一、jQueryEasyUI的核心概念 1. **组件化**:jQueryEasyUI将常见的用户界面元素如表格、对话框、菜单、按钮等封装为独立的组件...
在jQuery EasyUI v1.3.5中,开发者可以找到每个组件的详细API,包括其方法、属性、事件以及示例代码。这些API文档能帮助开发者更高效地实现网页的界面设计和功能实现。例如,通过API,开发者可以了解到如何初始化...
- jQuery EasyUI 基于 jQuery,因此对主流浏览器有良好的兼容性,包括 IE6 及以上版本。 - 尽管它封装了许多功能,但通过合理的优化和按需加载,仍能保持较好的性能表现。 总的来说,jQuery EasyUI 为 JavaWeb ...
jQuery EasyUI 是一个基于 jQuery 的前端框架,它简化了网页用户界面开发,提供了一系列易于使用的组件,如对话框、表格、菜单、按钮等。这个压缩包文件“jQuery EasyUI 中文API1.4.5 版”包含了1.4.5版本的jQuery ...
1. **事件处理**:EasyUI组件支持多种事件,如`onLoadSuccess`(数据加载成功后触发)、`onClickRow`(点击表格行时触发),通过`bind`或`delegate`方法绑定。 2. **数据操作**:`loadData`用于动态加载数据,`...
jQuery EasyUI 是一个基于 jQuery 的前端框架,它提供了一系列易于使用的组件,帮助开发者快速构建用户界面。这个"jquery-easyui 例子"压缩包包含了完整的示例,旨在确保你能直观地看到各种功能的实际效果。 EasyUI...
我在做项目时,经常用到easyUI框架,今天总结一下easyUI中的combobox吧 创建easyui-combobox的方法,在easyUI的官网都有: 1、从带有预定义结构的 元素创建组合框(combobox) <select id=cc class=easyui-...
效果图: 图标 (function($){ //初始化清除按钮 function initClear(target){ var jq = $(target);... var opts = jq.data('combo').options;... var combo = jq.data('combo').combo;... var arrow = combo.find('...
1. **jQuery基础**:在深入jQuery EasyUI之前,需要对jQuery的基本用法有所了解,包括选择器、事件处理、DOM操作和动画效果等。jQuery简化了JavaScript的DOM操作,使得开发者能够更加高效地操作页面元素。 2. **...
jQuery EasyUI是一个基于jQuery的前端框架,用于快速构建用户界面。它封装了大量常见的UI组件,如表格、下拉框、对话框、菜单等,极大地简化了网页开发过程。EasyUI的目标是通过简单的HTML标记和JavaScript,让...
jQuery EasyUI 是一个基于 jQuery 的前端框架,它提供了一系列易于使用的组件,用于快速构建用户界面。这个框架在1.2.4版本时非常流行,因为它简化了网页开发,特别是对于那些需要创建数据驱动的Web应用的开发者。...
- **jQuery**: EasyUI 基于 jQuery,因此需要对 jQuery 的基础操作有一定的了解,如选择器、事件处理和DOM操作。 - **数据绑定**: EasyUI 支持通过 JSON 数据绑定到 UI 组件,简化了前后端交互。 - **主题系统**:...