Ext,保存输入记录并在输入时进行提示

  Ext的ComboBox组件用法很多,通过配置可以让其变成一个输入框,并且可以存储输入的记录,然后再之后的输入中根据记录进行提示,以提高输入操作的用户体验。

  代码很简单,基本操作如下:

// 输入提示
Ext.create("Ext.form.ComboBox", {
		renderTo: "放置的组件ID",
		name: "input",
		labelWidth: 40,
		width: 400,
		hideEmptyLabel: true, 	// 隐藏空的文本标签
		hideTrigger: true, 		// 隐藏下拉按钮
		queryMode: "local",		// 查询方式,远程或是本地
		enableKeyEvents: true,	// 允许键盘事件
		margin: "10 0 0 0",
		displayField: "content",
		valueField: "content",
		store: Ext.create("Ext.data.Store", {
				fields: ["content"]
			}),
		inputData: [],		// 保存已经输入的信息
		listeners: {
				keydown: function(el, e) {
						if (e.getKey() === Ext.EventObject.ENTER) {
							var has = false;
							// 遍历已输入的内容
							Ext.each(el.inputData, function(item) {
									// 查看输入内容是否存在
									if (item.content === el.getValue()) {
										has = true;
										return false;
									}
									return true;
								});
							if (!has) {
								// 保存输入内容
								el.inputData.push({content: el.getValue()});
								// 将输入内容加载到下拉框存储中
								el.getStore().loadData(el.inputData);
							}
						}
					}
			}
	});


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值