`
阅读更多

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/

1
0
分享到:
评论
1 楼 蕃薯耀 2016-12-29  
jquery easyui combobox 级联及触发事件,combobox级联

>>>>>>>>>>>>>>.
蕃薯耀

相关推荐

    jquery easyui combobox 级联java demo(真正可用)

    以下将详细介绍如何使用jQuery EasyUI的Combobox实现级联功能,并结合Java后端处理JSON数据。 首先,理解jQuery EasyUI Combobox的基本用法。Combobox组件在HTML中表现为一个输入框和一个下拉列表,通过JavaScript...

    jQuery EasyUI编辑DataGrid用combobox实现多级联动

    当用户在第一级combobox中选择一个值时,触发该事件,此时可以获取到所选值并根据这个值动态更新第二级combobox的`url`,然后调用`reload`方法重新加载数据。这样,第二级combobox的选项就会基于第一级的选择进行...

    EasyUI学习之Combobox级联下拉列表(2)

    总结来说,EasyUI的Combobox级联下拉列表实现的关键在于JavaScript的事件监听和数据加载。通过AJAX请求获取数据,结合EasyUI的Combobox组件特性,我们可以创建出灵活且互动的级联选择界面,这对于多层分类或层次化...

    easyui的datagrid中editor和combobox的级联

    ### easyui的datagrid中editor和combobox的级联 在前端开发中,easyui是一个非常实用的库,它提供了一套完整的用户界面组件,能够帮助开发者快速构建出功能丰富的Web应用。其中,`datagrid`是easyui提供的一个重要...

    datagrid中combobox的级联

    - 当第一个 `combobox`(省份)的值改变时,通过 `onChange` 事件触发 AJAX 请求。 - 请求的参数是新选择的省份 ID,即 `parentid:newValue`。 - 请求返回的数据应该是市区列表,格式化为 `combobox` 可以理解的 ...

    jQuery EasyUI 1.4.2 版 API 中文版.zip

    jQuery EasyUI 是一个基于 jQuery 的前端框架,它提供了一系列易于使用的组件,用于快速构建用户界面。1.4.2 版本是这个框架的一个稳定版本,包含了许多改进和修复,以提升开发者的体验和应用程序的性能。这个压缩包...

    jQueryEasyUI

    在本文中,我们将深入探讨jQueryEasyUI的核心概念、主要组件以及与Java的集成方式。 一、jQueryEasyUI的核心概念 1. **组件化**:jQueryEasyUI将常见的用户界面元素如表格、对话框、菜单、按钮等封装为独立的组件...

    jQuery EasyUI v1.3.5官方API中文版

    在jQuery EasyUI v1.3.5中,开发者可以找到每个组件的详细API,包括其方法、属性、事件以及示例代码。这些API文档能帮助开发者更高效地实现网页的界面设计和功能实现。例如,通过API,开发者可以了解到如何初始化...

    jquery-easyui demo

    - jQuery EasyUI 基于 jQuery,因此对主流浏览器有良好的兼容性,包括 IE6 及以上版本。 - 尽管它封装了许多功能,但通过合理的优化和按需加载,仍能保持较好的性能表现。 总的来说,jQuery EasyUI 为 JavaWeb ...

    jQuery EasyUI 中文API1.4.5 版

    jQuery EasyUI 是一个基于 jQuery 的前端框架,它简化了网页用户界面开发,提供了一系列易于使用的组件,如对话框、表格、菜单、按钮等。这个压缩包文件“jQuery EasyUI 中文API1.4.5 版”包含了1.4.5版本的jQuery ...

    jquery easyui的使用说明手册

    1. **事件处理**:EasyUI组件支持多种事件,如`onLoadSuccess`(数据加载成功后触发)、`onClickRow`(点击表格行时触发),通过`bind`或`delegate`方法绑定。 2. **数据操作**:`loadData`用于动态加载数据,`...

    jquery-easyui 例子

    jQuery EasyUI 是一个基于 jQuery 的前端框架,它提供了一系列易于使用的组件,帮助开发者快速构建用户界面。这个"jquery-easyui 例子"压缩包包含了完整的示例,旨在确保你能直观地看到各种功能的实际效果。 EasyUI...

    easyUI combobox实现联动效果

    我在做项目时,经常用到easyUI框架,今天总结一下easyUI中的combobox吧 创建easyui-combobox的方法,在easyUI的官网都有: 1、从带有预定义结构的 元素创建组合框(combobox) <select id=cc class=easyui-...

    jQuery EasyUI 为Combo,Combobox添加清除值功能的实例

    效果图: 图标 (function($){ //初始化清除按钮 function initClear(target){ var jq = $(target);... var opts = jq.data('combo').options;... var combo = jq.data('combo').combo;... var arrow = combo.find('...

    jquery-easyui文档

    1. **jQuery基础**:在深入jQuery EasyUI之前,需要对jQuery的基本用法有所了解,包括选择器、事件处理、DOM操作和动画效果等。jQuery简化了JavaScript的DOM操作,使得开发者能够更加高效地操作页面元素。 2. **...

    jQuery EasyUI

    jQuery EasyUI是一个基于jQuery的前端框架,用于快速构建用户界面。它封装了大量常见的UI组件,如表格、下拉框、对话框、菜单等,极大地简化了网页开发过程。EasyUI的目标是通过简单的HTML标记和JavaScript,让...

    jQuery EasyUI1.2.4

    jQuery EasyUI 是一个基于 jQuery 的前端框架,它提供了一系列易于使用的组件,用于快速构建用户界面。这个框架在1.2.4版本时非常流行,因为它简化了网页开发,特别是对于那些需要创建数据驱动的Web应用的开发者。...

    Jquery EasyUI 1.5API 中文版

    - **jQuery**: EasyUI 基于 jQuery,因此需要对 jQuery 的基础操作有一定的了解,如选择器、事件处理和DOM操作。 - **数据绑定**: EasyUI 支持通过 JSON 数据绑定到 UI 组件,简化了前后端交互。 - **主题系统**:...

Global site tag (gtag.js) - Google Analytics