Ext.form.ComboBox 本地和远程模式的基本定义-优快云博客

本文链接：https://blog.youkuaiyun.com/iteye_16154/article/details/82040248

本文详细介绍了ExtJS中组合框的两种配置方式：本地模式和远程模式，并提供了具体的配置实例，包括必填项和常见配置选项。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一.本地模式

var articlekind = new Ext.form.ComboBox({
		 fieldLabel : '部门',  //UI标签名称
		 name : 'identity',   //作为form提交时传送的参数名
		 allowBlank : false,  //是否允许为空
		 mode : 'local',      //数据模式, local为本地模式, 如果不设置,就显示不停的加载中...
		 readOnly : true,     //是否只读
		 triggerAction : 'all',  //显示所有下列数.必须指定为'all'
		 anchor : '90%',
		 emptyText:'请选择...',  //没有默认值时,显示的字符串
		 store : new Ext.data.SimpleStore({  //填充的数据
						   fields : ['text', 'value'],
						   data : [['t1', 'v1'], ['t2', 'v2'], ['t3', 'v3']]
		 }),
		 value:'t2',  //设置当前选中的值, 也可用作初始化时的默认值, 默认为空  
		 valueField : 'value',      //传送的值
		 displayField : 'text',     //UI列表显示的文本
		 regex : /[\u4e00-\u9fa5]/,   //只能输入中文. 正则表达式验证:详见: http://www.blogjava.net/algz/articles/263284.html
		 regexText : "只能输入中文!"       //使用正则表达式时,设置的错误提示
 });

五个必须项.

二.远程模式

//author.json页面:    {author : [{text : "t1" , value : "v1" } , {text : "t2" , value : "v2" }]}
  var remoteComboBox= new Ext.form.ComboBox({
		 fieldLabel : '部门',  //UI标签名称
		 name : 'identity',   //作为form提交时传送的参数名
		 allowBlank : false,  //是否允许为空
		 mode : "remote",      //数据模式为远程模式, 也可不设置,即默认值也为remote
		 readOnly : true,     //是否只读
		 triggerAction : 'all',  //显示所有下列数.必须指定为'all'
		 anchor : '90%',
		 emptyText:'请选择...',   //没有默认值时,显示的字符串
		 store : new Ext.data.JsonStore({  //填充的数据
						   url : "author.json",
						   fields : new Ext.data.Record.create( ['text', 'value']),   //也可直接为["text","value"]
						   root : "author"
		 }),
		 value:'v2',  //设置当前选中的值, 也可用作初始化时的默认值, 默认为空
		 valueField : 'value',  //传送的值
		 displayField : 'text'  //UI列表显示的文本
 });