`

easyui combobox两种联动方法与导致ie6崩溃问题

阅读更多
$(function(){
var stEventType =  $('#stEventType').combobox({
       url:'sub_template/code_json.jsp?type=EVENT_TYPE',
       editable:false,
       valueField:'tid',
       textField:'text',
       required:true,
       onSelect:function(record){
       stEventName.combobox({
           url:'sub_template/code_json.jsp?type='+record.tid,
           editable:false,
           valueField:'tid',
           textField:'text',
           required:true
       }).combobox('clear');
	  }
       
   });
var sub_value = $('#stEventType').combobox('getValue');
if(sub_value==''){
sub_value='EVENT_TYPE_1';
}
var stEventName = $('#stEventName').combobox({
       url:'sub_template/code_json.jsp?type='+sub_value,
       editable:false,
       valueField:'tid',
       textField:'text',
       required:true
   });
$('#stDiscoverUnit').combobox({
		  editable:false,
		  url:'sub_template/unit_json.jsp?streetId=<%=(String)session.getAttribute("streetId")%>&typestr=1~2~-1',
		  valueField:'text',
		  required:true,  
		  textField:'text'
	});
$("#type_div").show();
$("#name_div").show();	
});


<div id="type_div" style="display:none">
<input id="stEventType" type="text" style="width:155px" value=""/>
</div>
</td>
<td align="center" valign="middle" class="table_title"  nowrap="nowrap" >
<font color="red">*</font>事件名称</td>
<td class="table_content">
<div id="name_div" style="display:none">
<input  id="stEventName"  type="text" style="width:155px" value=""/>
</div>


用于combobox的联动 div一般情况下是可以不需要的 这里加上主要是因为数据回显的时候js加载较慢 防止数据显示select value出来

此方法在项目中同一页面js过多的情况下会导致ie6崩溃
于是采用第二种方法
$(function(){
								var type_select =  $('#stEventType').combobox({
						       		url:'sub_template/code_json.jsp?type=EVENT_TYPE',
						       		editable:false,
						       		valueField:'tid',
						       		textField:'text',
						       		onSelect:function(record){
						       			$('#stEventName').combobox('clear');
						       			$('#stEventName').combobox('reload','sub_template/code_json.jsp?type='+record.tid);  
						        	}
						  		});
								var sub_select = $('#stEventName').combobox({
									disabled:false,
						       		url:'sub_template/code_json.jsp?type=EVENT_TYPE_1',
						       		valueField:'tid',
						       		textField:'text'
						   		});
							});


分享到:
评论

相关推荐

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

    在jQuery EasyUI中,DataGrid是一种常用的表格展示控件,它可以与各种编辑器结合使用,如combobox(下拉框)来实现更丰富的交互功能。本文主要探讨的是如何利用jQuery EasyUI的DataGrid和combobox组件实现多级联动的...

    easyUI combobox实现联动效果

    实现 EasyUI Combobox 的联动效果通常包括以下步骤: 1. **创建 Combobox** - 通过 `&lt;select&gt;` 元素创建:预先定义好选项,添加 `class="easyui-combobox"` 和 `id`。 - 通过 `&lt;input&gt;` 标签创建:指定 `data-...

    在easyui-combobox多选模式下加入选择所有选项

    最后,调用`reload`方法刷新Combobox,使其界面与数据同步。 在实际应用中,我们可能还需要处理反选(取消所有选择)的功能,这可以通过在按钮上添加一个条件判断来实现: ```javascript if ($('#myComboBox')....

    easyui-textbox和easyui-combobox的onchange事件响应实例

    在这个实例中,我们将深入探讨 EasyUI 中的两个重要组件:`easyui-textbox` 和 `easyui-combobox`,以及它们的 `onchange` 事件响应。 `easyui-textbox` 是一个基础输入框组件,它扩展了原生 HTML 的 `input` 元素...

    easyui-combobox、combotree后台数据数据组装与前台绑定实例

    总结来说,"easyui-combobox、combotree后台数据数据组装与前台绑定实例" 主要涉及两个部分:后端 C# 数据组装成 JSON 格式,以及前端使用 EasyUI 的 Combobox 和 Combotree 组件进行数据绑定。通过这样的方式,我们...

    easyui中combobox后台交互实例

    在本文中,我们将深入探讨EasyUI中的Combobox组件以及如何实现与后台的交互。EasyUI是一个基于jQuery的轻量级前端框架,它提供了一系列易于使用的UI组件,包括Combobox,用于创建下拉列表框,同时支持后台数据加载,...

    combobox模糊查询在IE中崩溃

    标题 "combobox模糊查询在IE中崩溃" 描述了在使用jQuery EasyUI组件中的Combobox进行模糊查询时遇到的问题,特别是在Internet Explorer(IE)浏览器环境下,由于数据量过大导致浏览器崩溃。这通常与JavaScript内存...

    jquery easyui combobox mysql 数据库的省市县三级联动的例子

    在这个例子中,我们关注的是"jQuery EasyUI ComboBox"与MySQL数据库相结合,实现省市县三级联动的功能。这通常用于地址选择或者地区筛选等场景,使得用户能够方便地从预定义的层次结构中选择他们的地理位置。 首先...

    Easyui Combobox 过滤功能,类似火车票网站过滤

    Combobox(组合框)是 EasyUI 中的一个非常实用的组件,它可以看作是一个下拉列表与文本框的结合体。Combobox 具有搜索、排序等功能,能够极大地提升用户体验。在实际应用中,Combobox 常用于地址选择、类别筛选等...

    EasyUI Combobox设置默认值 获取text的方法

    在使用EasyUI框架进行Web开发时,Combobox是一种常见的组件,它将下拉列表与输入框结合,方便用户选择或输入数据。本文将详细介绍如何在EasyUI Combobox中设置默认值以及如何获取选中项的text。 首先,我们来看如何...

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

    例如,我们可以使用`combobox`方法和`on`事件监听器: ```javascript $("#province").combobox({ url: 'ajaxsvr', // 这里是后端接口地址,用于获取省份数据 valueField: 'id', textField: 'name' }); $("#...

    easyUI各版本与ie浏览器兼容问题

    easyUI各版本与ie浏览器兼容问题

    easyui的datagrid中editor和combobox的级联

    文中提到的第一种方法更为推荐,因为它避免了由于`index`计算错误导致的问题。 - 确保数据接口返回的数据格式与`combobox`的配置相匹配,避免因为数据格式不一致而导致的显示异常。 #### 五、扩展思考 除了基本的...

    jquery easyui combobox模糊过滤(示例代码)

    修改jquery easyui combobox模糊过滤 代码如下:filter:function(q,row){ var opts=$(this).combobox(“options”); //return row[opts.textField].indexOf(q)==0;// return row[opts.textField].indexOf(q)&gt;-1;//将...

    easyui兼容ie6方法总结

    以下是一些解决 EasyUI 在 IE6 中兼容性问题的方法和优化策略。 1. 页面重复加载问题: 这个问题通常是由于在页面加载时,多次触发了同一事件,导致内容被加载多次。例如,原本应该只刷新一次的 panel 控件被刷新...

    Easyui二级联动

    EasyUI 提供了一种简单且高效的方式来实现这一功能,通过结合 jQuery 的强大功能,开发者可以轻松地构建出具有动态二级联动效果的界面。 #### 二、EasyUI 简介 EasyUI 是一个基于 jQuery 的 UI 插件集合,它提供了...

    easyui三级联动代码

    在实现三级联动时,我们主要会用到`combobox`组件,这是一种下拉框控件,可以实现级联选择功能。 1. **创建HTML结构**: 在HTML文件中,我们需要为每个级别(省、市、区)创建一个`combobox`元素,并设置相应的ID...

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

    在本文中,我们将深入探讨EasyUI的Combobox级联下拉列表的实现,这是一个非常实用的功能,常用于数据筛选和信息检索。EasyUI是基于jQuery的前端框架,它提供了丰富的UI组件,使得开发者能够快速构建美观且响应式的...

Global site tag (gtag.js) - Google Analytics