Ext 下拉列表模糊搜索
/**
* Created by huangbaidong on 2016/9/18.
* 楼盘通用Combo组件,支持模糊查询
* 使用案例:
* {
fieldLabel : '楼盘名称',
xtype: 'residentialAreaCombo',
name : 'buildingId',
queryParams:{
orgId:top.loginUser.orgId
}
}
*/
Ext.define('app.component.biz.house.ResidentialAreaCombo', {
extend: 'Ext.form.field.ComboBox',
alias: 'widget.residentialAreaCombo',
displayField: 'name',
valueField: 'id',
queryMode: 'local',
listConfig: {
maxHeight:200,
itemTpl: new Ext.XTemplate('{name} ')
},
constructor : function(config) {
Ext.apply(config, {
store: Ext.create('app.component.biz.house.ResidentialAreaStore', {
queryParams : config.queryParams
})
});
app.component.biz.house.ResidentialAreaCombo.superclass.constructor.call(this, config);
},
listeners:{
change : function(combo, record, eOpts) {
if(this.callback) {
if(combo.lastSelection && combo.lastSelection.length>0) {
this.callback(combo.lastSelection[0]);
}
}
},
beforequery : function(e) {
var combo = e.combo;
combo.collapse();//收起
var value = combo.getValue();
if (!e.forceAll) {//如果不是通过选择,而是文本框录入
combo.store.clearFilter();
combo.store.filterBy(function(record, id) {
var text = record.get(combo.displayField);
// 用自己的过滤规则,如写正则式
return (text.indexOf(value) != -1);
});
combo.onLoad();//不加第一次会显示不出来
combo.expand();
return false;
}
if(!value) {
//如果文本框没值,清除过滤器
combo.store.clearFilter();
}
}
} });
/**
* Created by huangbaidong on 2016/9/18.
* 楼盘组件通用Store,
*/
Ext.define('app.component.biz.house.ResidentialAreaStore', {
extend: 'Ext.data.Store',
autoLoad : true,
constructor : function(config) {
Ext.apply(config, {
/*data:(function(){
var array = [];
Ext.each(top.productStore.getData().items, function(item) {
if(item.data.orgId == config.filterParams.orgId) {
array.push(item);
}
})
return array;
})()*/
proxy: {
type: 'ajax',
url: '../CstResidentialArea/queryAll',
reader: {
type: 'json',
rootProperty: 'datas',
totalProperty: 'total'
},
extraParams: config.filterParams
}
});
app.component.biz.house.ResidentialAreaStore.superclass.constructor.call(this, config);
}
});
Ext 下拉列表模糊搜索的更多相关文章
- 一款不错的多选下拉列表利器—— Ext.ux.form.SuperBoxSelect
在B/S系统中,下拉列表(select/dropdownlist/combobox)的应用随处可见,为了增强用户体验,开发人员也常常会做一些带联想功能的下拉列表, 特别是数据项比较多的时候,用户筛选起 ...
- Ext的异步请求(二级级联动态加载下拉列表)
页面: <tr> <td class="label" width="300" >作业计划项模板</td> <td> ...
- [转]ExtJs4 笔记(13) Ext.menu.Menu 菜单、Ext.draw.Component 绘图、Ext.resizer.Resizer 大小变更
作者:李盼(Lipan)出处:[Lipan] (http://www.cnblogs.com/lipan/)版权声明:本文的版权归作者与博客园共有.转载时须注明本文的详细链接,否则作者将保留追究其法律 ...
- 无废话ExtJs 入门教程十二[下拉列表联动:Combobox_Two]
无废话ExtJs 入门教程十二[下拉列表联动:Combobox_Two] extjs技术交流,欢迎加群(201926085) 不管是几级下拉列表的联动实现本质上都是根据某个下拉列表的变化,去动态加载其 ...
- 无废话ExtJs 入门教程十一[下拉列表:Combobox]
无废话ExtJs 入门教程十一[下拉列表:Combobox] extjs技术交流,欢迎加群(201926085) 继上一节内容,我们在表单里加了个一个下拉列表: 1.代码如下: 1 <!DOCT ...
- [转载]ExtJs4 笔记(8) Ext.slider 滚轴控件、 Ext.ProgressBar 进度条控件、 Ext.Editor 编辑控件
作者:李盼(Lipan)出处:[Lipan] (http://www.cnblogs.com/lipan/)版权声明:本文的版权归作者与博客园共有.转载时须注明本文的详细链接,否则作者将保留追究其法律 ...
- EXt form属性
配置项: success:执行成功后回调的函数,包括两个参数:form和action failure:执行失败后回调的函数,包括两个参数:form和action method:表单的提交方式,有效值包 ...
- Ext.form.ComboBox 后台取值 动态加载 ext5.0.0
我用的extjs是5.0.0版本的. 请注意:如果这里没有的combobox相关内容,这里一定有. 开始的时候keyup事件取到的数据就是放不到ComboBox中,放全局变量也不好用.最后大神出手帮忙 ...
- Ext 初级UI设计
Ext.Button 说明:该组件代替了传统submit,reset,buuton HTML控件构造参数: text: 按钮上的名称 handler:指定一个函数句柄,在默认事件触发时调用,此时的默认 ...
随机推荐
- TortoiseSVN的相关问题
图标覆盖问题: 创建一个保存文档的目录,创建一个工作目录,工作目录创建后,没有显示覆盖图标.解决办法如下: 找到设置,在工作目录下右键 打开界面如下: 从包含路径中设置就可以. 目录检出后把它从检出状 ...
- Interesting things in Unity 4.5 you probably didn't know about
http://va.lent.in/interesting-things-in-unity-4-5-you-probably-didnt-know-about/
- ServiceBase 备份
using CanDoo.Contracts; using CanDoo.Core.Data; using System; using System.Collections.Generic; usin ...
- Python Paramiko模块与MySQL数据库操作
Paramiko模块批量管理:通过调用ssh协议进行远程机器的批量命令执行. 要使用paramiko模块那就必须先安装这个第三方模块,仅需要在本地上安装相应的软件(python以及PyCrypto), ...
- Centos6.5搭建java开发环境
一.安装jdk 1.查看Linux自带的JDK是否已安装 java –version 如果出现openjdk,最好还是先卸载掉openjdk,在安装sun公司的jdk. 2.查看jdk信息 rpm - ...
- select2搜索框查询加遍历
<div class="form-group"> <label class="control-label col-sm-1 no-padding-rig ...
- post、get的区别
get的参数会显示在浏览器地址栏中,而 post的参数不会显示在浏览器地址栏中: 使用 post提交的页面在点击[刷新]按钮的时候浏览器一般会提示“是否重新提交”,而 get则不会: 用get的页面可 ...
- 快速理解C#高级概念(一) Delegate委托
做.NET开发很久,最近重新温习<C#高级编程>一书.发现很多曾经似懂非懂的问题,其实也是能够慢慢钻研慢慢理解的. 所以,打算开写<C#高级编程系列>博文.其中会借鉴<C ...
- linux安装-版本选择-终极决定
选用64位或32位的版本,注意看硬件: 内存大于4G的用64位, 小于4G的用32位 同时, 64位的版本在软件源, 软件的兼容性等问题. ----------------------------- ...
- Linux下的一个图形管理工具webmin
这个工具其实我在两年前的小白时期还是经常用的,因为那时候对Linux比较陌生在为数server的时候帮了我很多工作,现在周末外面下雨,闲来无事莫名其妙的想起他来. 工具优点:最大特点是他是脚本安装 不 ...