`
zhcl321
  • 浏览: 25973 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

Ext comboBox的remote模式,联想功能实现

    博客分类:
  • Ext
阅读更多
			function showUserGroupComBox(){
				if(userGroupComBox!=null){
					userGroupComBox.destroy();
				}
				userGroupComBox = new Ext.form.ComboBox({
					id : "userGroupComBox",
					name : 'userGroupComBox',
					triggerAction : 'all',
					displayField : 'value',
					valueField : 'value',
					mode : 'remote',
					// mode : 'local',
					width : 180,
					loadingText : "please waitting",
					editable : true,
					resizable : true,
					typeAhead : false,
					minChars : 1,
					enableKeyEvents: true,
					hideTrigger : (Ext.getCmp("userTypeComBox").value == "MSISDN_USER" || Ext.getCmp("userTypeComBox").value == "IMSI_USER")?true:false,
					store : (proVersion == is7X8X) ? [["", ""]] : childStore,
					listeners : {
						// 验证用户输入的用户群是否正确
						blur : function(combo, record, index) {
							if(!queryFlag){
								Ext.get("msg").dom.innerHTML = '<img src=\"'
									+ basePath
									+ '/theme/default/images/cue.png">&nbsp;' + "<span style='color:red;line-height:24px;' ext:qtip='" + tag_userNotSupportSearch + "'>" 
								+ ps.string.cutString(tag_userNotSupportSearch, ggsnbarTitleMaxLength,true) + "</span>";
								return queryFlag;
							}							
							var comTypeValue=Ext.getCmp("userTypeComBox").value;
							var currInputValue = combo.value;

							if (combo.value == "") {
								currMSISDN = "";								
								Ext.ps.commonCmp.UserGroup.setTipInfo(comTypeValue);
								return;
							} else {
								currMSISDN = "";
								// 判断输入的用户格式是否符合
								if (Ext.ps.commonCmp.UserGroup
										.checkInput(currInputValue) == false) {
									return;
								} 
								/*else {
									queryMSISDN(currInputValue);
								}*/
							}
						},
						keyup: function(combo, evt) {
						    firstTime = false;
						},
						select:function (combo, record, index){
							if(!queryFlag){
								Ext.get("msg").dom.innerHTML = '<img src=\"'
									+ basePath
									+ '/theme/default/images/cue.png">&nbsp;' + "<span style='color:red;line-height:24px;' ext:qtip='" + tag_userNotSupportSearch + "'>" 
								+ ps.string.cutString(tag_userNotSupportSearch, ggsnbarTitleMaxLength,true) + "</span>";
							}
							firstTime = true;
							return queryFlag;
						},
						beforeselect: function (combo, record, index){
                            if (record.data.value == "<div style=\"background-color:#ffffff;cursor:default;\"\>...</div>") {
                                // 如果选择 ... 则不更改选当前选择的值
                                var originValue = combo.value;
                                combo.setValue(originValue);
                                combo.collapse();
                                combo.selectText(originValue.length, originValue.length);
                                firstTime = true;
                                return false;
                            }
                            return true;
                        }
					}
				});
				if(userGroupPanel!=null){
					userGroupPanel.insert(2,userGroupComBox);
					userGroupPanel.doLayout();
				}
			}
分享到:
评论

相关推荐

    Ext combobox 下拉多选框带搜索功能

    在给定的标题“Ext ComboBox 下拉多选框带搜索功能”中,我们关注的是一个特别的ComboBox实现,它不仅允许用户从下拉列表中选择多个选项,还具备搜索功能,使得用户可以更高效地找到他们想要的选择项。 ComboBox在...

    ext combobox二级联动

    ext,ext combobox,ext二级联动,ext combobox二级联动 ___本人的原则:上传好东西,但绝不便宜.因为自己的心血 ext combobox二级联动,ext ,ext combobox,combobox,combobox二级联动,ext 二级联动 groupCombo.on('...

    Ext4.0 动态修改ComboBox选择项(本地模式)

    本知识点主要聚焦于如何在Ext4.0框架下动态修改ComboBox的选择项,特别是在本地模式下进行操作。Ext4.0是Sencha Ext JS的一个版本,它提供了一个强大的JavaScript组件库,用于构建富客户端应用程序。 首先,...

    Ext ComboboxGrid

    "Ext ComboboxGrid"是一个基于Ext JS框架的组件,它结合了下拉框(ComboBox)和数据网格(Grid)的功能,提供了一种更强大的选择和筛选数据的方式。在Ext JS中,ComboBox通常用于显示一个可选的下拉列表,而Grid则...

    用Ext 2.0 combobox 做的省份和城市联动选择框的例程

    在本文中,我们将深入探讨如何使用Ext 2.0的ComboBox组件实现省份和城市联动选择框的功能。Ext是一个强大的JavaScript库,它提供了丰富的用户界面组件,包括ComboBox,用于创建下拉选择框。在这个例程中,我们将看到...

    Ext ComBobox 附带完整附件

    Ext ComBobox是一款基于JavaScript库Ext JS开发的下拉组合框组件,它为用户界面提供了一种高效、灵活且功能丰富的选择输入方式。这个组件通常用于在网页应用中实现复杂的数据选择,比如从一个长列表中选取一项或者...

    Ext组合框comboBox带分页

    用EXT来实现下拉框ComboBox 下拉框可以实现分页

    extjs3.x combobox智能联想

    在提供的`combobox智能联想.txt`文件中,可能会包含实现上述功能的具体代码示例,包括EXTJS的配置、事件处理和可能的自定义扩展。通过阅读和理解这些代码,你可以更好地掌握EXTJS 3.x Combobox的智能联想功能,并...

    Ext2.0本地模式动态修改combobox选择项

    标题中的“Ext2.0本地模式动态修改combobox选择项”指的是使用Ext JS 2.0框架中的Combobox组件在本地数据模式下实现动态更新选择项的功能。Ext JS是一个流行的JavaScript库,主要用于构建富客户端Web应用程序。...

    extjs的ComboBox 2级联动

    以下是一个简单的步骤来实现这个功能: 1. **创建数据模型**:定义两个数据模型,分别对应一级和二级选项。例如,省份和城市的数据结构可能如下: ```javascript Ext.define('Province', { extend: 'Ext.data....

    Ext.form.field.ComboBox结合Java、JSON实现AutoComplete

    本示例探讨如何利用Ext JS中的`Ext.form.field.ComboBox`组件,结合Java后端和JSON数据格式,来创建这样一个功能。 `Ext.form.field.ComboBox`是Ext JS框架中一个强大的组件,它提供了下拉列表的功能,可以用于创建...

    EXT2_combobox_form.rar_combobox ext_ext

    2. JavaScript文件:EXT2库本身,以及实现combobox和form表单功能的自定义脚本。 3. CSS文件:用于定义示例的样式和布局。 4. 图片或其他资源文件:可能包含示例中用到的图标或其他视觉元素。 通过学习和理解EXT2的...

    combobox Ext之扩展组件多选下拉框

    要实现多选下拉框,我们需要对原生的ComboBox进行以下改造: 1. **配置项设置**: - `multiSelect`:设置为`true`,启用多选功能。 - `typeAhead`:多选模式下通常不需要自动补全,可以设置为`false`。 - `...

    Ext带图标Combobox

    实现这个功能通常需要自定义Combobox的模板,添加图标占位符,并在数据加载时为每个选项指定相应的图标。 **3. 自定义模板** Ext JS的模板系统是通过XTemplate实现的,它支持动态渲染HTML。在创建IconCombobox时,...

    Ext 组合框 ComboBox 参数详解

    该资源是war包,里面包括ComboBox中的各个参数, 详细讲解在我的文档中有

Global site tag (gtag.js) - Google Analytics