`

ExtJS多选到文本框

阅读更多
<script>
// 初始化Store
var allUser=new Array();
<%
	sql="select tui.User_ID, tui.User_Name, tui.Department_name from t_user_info tui where tui.User_ID in (select user_id from t_userole_info where role_id ='4' or role_id='5') order by tui.User_Name"
	set rs=db.execute(sql)
	do while not rs.eof
		str=rs("Department_name")
		if str<>"" then
			str_arr=split(str,"/")
			str=""
			if ubound(str_arr)<>-1 then
				for i=0 to ubound(str_arr)-1
					if i=ubound(str_arr)-1 then
						str=str&str_arr(i)
					else
						str=str&str_arr(i)&"/"
					end if
				next
			end if
		end if
		response.Write "allUser[allUser.length]={id:'"&rs("User_ID")&"',display:'"&rs("User_Name")&"--"&str&"'};"
		rs.movenext
	loop
	rs.close
%>
</script>

storeAllMan= new Ext.data.JsonStore({
		fields:['id', 'display'],
		data:allUser
});

var cc_users=new  Ext.form.ComboBox ({
		displayField:'display',
		valueField :'id',
		store : storeAllMan,
		hiddenName : 'userId',
	    typeAhead: true,
		mode: 'local',
		triggerAction: 'all',
		emptyText:'选中后回车添加到下边的列表中',
		width:400,
		allowBlank:true,
		selectOnFocus:true,
		forceSelection:true,
		renderTo :'cc_users'
    });
	cc_users.queryStr="";
    cc_users.on("beforequery",function(obj){
    	var qs=obj.query;
    	if(qs==cc_users.queryStr && cc_users.queryStr!=""){
    		obj.cancel=true;
    	}
    	cc_users.queryStr=qs;
    });
	cc_users.on('select',function(obj,record){
		addOption(record.data.id,record.data.display,"selected_users");
		obj.focus(true);
	});
	cc_users.on('specialkey',function(obj,e){
		if(e.getCharCode()==13)
			e.stopEvent();
	});

// 双击列表函数
function addOption(value,text){
	var obj=document.getElementById("selected_projects");
	if(isExist(value,obj))
		return;
	var option_obj=new Option(text,value);
	obj.options[obj.length]=option_obj;
	
}
function isExist(value,selectList){
	for(i=0;i<selectList.length;i++){
		if(selectList[i].value==value)
			return true
	}
	return false;
}
function del(s){
	if(s.selectedIndex==-1)return;
	s.options[s.selectedIndex]=null;
}
  • 大小: 91.4 KB
分享到:
评论

相关推荐

    Extjs4.2带复选框下拉树组件

    网上搜索了许久未找到...Extjs4.2 带复选框的下拉树,解决了向下勾选子节点、向上勾选父节点,正选反选获取值等问题,勾选的节点显示displayfield值直接显示在下拉文本框中。需要引用ext-all.js和ext-all-neptune.css

    ExtJS4中文教程2 开发笔记 chm

    ExtJS4学习笔记(八)---Grid多选 全选 ExtJS4学习笔记(六)---多表头Grid ExtJS4学习笔记(十)---ExtJS4图片验证码的实现 ExtJS4学习笔记(十一)---TabPanel ExtJS4学习笔记(十三)---上传文件(upload) ExtJS4学习笔记...

    extjs常用增删改查操作

    - **多选功能**:启用 GridPanel 的多选功能,以便一次删除多条记录。 - **确认提示**:在实际删除前弹出确认对话框。 - **更新数据**:删除选中的数据行,并从 Store 中移除对应的数据项。 #### 五、高级技巧 1...

    Extjs表单中的通用组件

    本文将重点介绍Extjs表单中的各种通用组件,包括文本框、单选按钮、多选按钮、下拉列表和日期选择器等,这些组件在实际开发中极为常见。 ### 文本框(TextField) 文本框是最基本的输入组件,允许用户输入文本数据...

    ExtJs教学基础篇参考文档

    这些食谱都是基于ExtJS JavaScript库编写的,涵盖了从基础到高级的各种应用场景和技术细节。 #### 三、ExtJs 3.0 Cookbook的主要内容 1. **概述:** - 本书首先介绍了ExtJs的基本概念和发展历史。 - 随后解释了...

    ExtJs组件类的对应表

    2. **`checkbox`** - `Ext.form.Checkbox`,多选框组件,用于创建多选输入。 3. **`combo`** - `Ext.form.ComboBox`,下拉框组件,用于创建下拉选择框。 4. **`datefield`** - `Ext.form.DateField`,日期选择项...

    Extjs中文教程

    - 数据在Extjs中不仅仅是指存储的数据,还涉及到数据的加载、处理和展示。 - 组件与数据紧密相关,许多组件都需要数据源的支持才能正常工作。 - **Ext.data.DataProxy类** - 负责从服务器加载数据,包括异步请求...

    ExtJs xtype一览

    通过以上解析可以看出,ExtJs提供了丰富的组件库,涵盖了从基础UI元素到复杂的表格和表单处理等多个方面。这些`xtype`不仅简化了开发流程,还大大提高了Web应用的交互性和用户体验。开发者可以根据具体需求灵活选择...

    Extjs教程_第八章_Tree(树)(2)

    当你双击一个节点时,TreeEditor 会自动为该节点创建一个文本框(TextField)供用户编辑。 - 编辑完成后,并不会自动保存到服务器。你需要监听 `beforecomplete` 事件,在事件处理函数中执行保存操作。例如: ```...

    Descriptive_Examination_System

    EXTJS的Form Panel则用于收集学生的答案,提供文本框、单选、多选等输入控件,满足不同类型的试题需求。此外,EXTJS的ProgressBar控件可以实时显示答题进度,增强用户体验。 管理人员界面则是EXTJS展现其强大数据...

    ext js 下拉树

    这可能涉及到修改Ext JS默认的主题或创建自定义样式。 以下是一个简单的下拉树实例代码片段,展示了如何配置`Ext.form.field.Tree`: ```javascript Ext.application({ name: 'MyApp', launch: function () { ...

    DELPHI+UniGUI开发常见问题集合说明

    uniGUI是优秀的delphi开发网页应用的框架,完全基于ExtJS,全面支持Ajax技术 转发:这个文档中的话题与解决方案,几乎全部来自UniGUI的交流群

    Ext组件描述,各个组件含义

    通过以上介绍可以看出,ExtJS 提供了丰富的 UI 组件库,涵盖了从基础到高级的各种类型。这些组件不仅提供了强大的功能,还具有高度可定制性,使得开发者能够轻松构建美观且功能完善的 Web 应用程序。

    EXT 中文手册内具实例代码

    - **多选选择**:可以使用 `Ext.query` 方法来获取多个 DOM 节点,例如 `Ext.query('.className')` 将返回页面中所有具有指定类名的元素集合。 - **节点操作**:获取到的节点集合可以通过循环等方式进行进一步的操作...

Global site tag (gtag.js) - Google Analytics