easyui combobox 3个下拉框级联新增显示,修改回显

前言

在实际项目中,有这么一个需求,3个下拉框选项是属于级联级别的,新增时:当选中第1个下拉框的值时,第二个下拉框根据第一下拉框中的类型查询数据,当第二个下拉框选中值时查询第三个下拉框的值并回显,修改时:回显选中第一个下拉框值,然后查询第二个下拉框并回显,然后查询第三个下拉框并回显(啰里啰嗦一大堆,千万不要蒙,接下来看图)
在这里插入图片描述
在这里插入图片描述

代码 (新增和修改使用同一个函数)

//所有类型加载
function eventAllTypeLoad(params){
	//案件类型
	$('.event_type').combobox({
		url:'www.baidu.com/hehe/do?type=1021',
		valueField:'code',  
	    textField:'text' ,
	    panelHeight:'80px',
		editable:false,
		/*data:[{
			id:91,
			text:"事件"
		},{
			id:92, 
			text:"单位"
		},{
			id:93, 
			text:"部件"
		}],*/
		onSelect:function(record){
			//案件大类
			$(".event_big_type").combobox({
				url:'www.baidu.com/hehe.do?type='+record.id,    
				valueField: 'code',    
			    textField: 'text', 
				editable:false,
				onSelect:function(record){
					console.log(record)
					//案件小类
					$(".event_small_type").combobox({
						url:'www.baidu.com/hehe.do?type='+record.id,    
						valueField: 'code',    
					    textField: 'text', 
						editable:false,
					    onLoadSuccess: function (){
				            if (params!=null&&params.event_small_type!=null) {
				                $(".event_small_type").combobox('select',params.event_small_type);
				                params = {};
				            }
				        }
					});
				},
			    onLoadSuccess: function (){ 
		            if (params!=null&&params.event_big_type!=null) {
		                $(".event_big_type").combobox('select',params.event_big_type);
		            }
		        }
			});
	    },
	    onLoadSuccess: function (){ 
    		 if (params!=null&&params.event_type!=null) {
                 $(".event_type").combobox('select',params.event_type);
             }
        }
	});
}

其中函数的参数params是用来修改时赋值的,如果只是添加则不用使用combobox中的onLoadSuccess

修改时的参数params

	var typeParams = {};
	typeParams.event_type = row.event_type;
	typeParams.event_big_type = row.event_big_type;
	typeParams.event_small_type = row.event_small_type;
	//类别选中
	eventAllTypeLoad(typeParams);

添加时的参数params

//所有类型案件类型
eventAllTypeLoad(null);
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值