easyUi和ext comBoBox的模糊查询 (支持拼音和汉字)
2015-12-31 14:45
447 查看
一.需要引入的js 链接:http://pan.baidu.com/s/1dEyAE8x 密码:t1l4
二. //easyUi
(1) $('#' + comboxId).combobox({
url: url,
valueField: 'code_value',
textField: 'code_name',
multiple: true,
value: '',
editable: true,
panelHeight: 'auto',
filter:filterCombo
})
(2) function filterCombo(q, row) {
var keys = new Array();
keys[keys.length] = 'code_name';
keys[keys.length] = 'code_value';
return filterComboboxData(q, row, keys);
}
(3) function filterComboboxData(q, row, keys) {
var result;
if (keys && keys.length > 0) {
for (var i = 0; i < keys.length; i++) {
if(escape(q).indexOf("%u") != -1) {//汉字
result = row[keys[i]].indexOf(q) > -1;
} else {
result = ConvertPinyin(row[keys[i]]).indexOf(q) > -1;
}
if (result == true) {
return true;
}
}
} else {
var opts = $(this).combobox('options');
return row[opts.textField].indexOf(q) > -1;
}
}
//ext
(1)
new Ext.form.ComboBox({
store: new Ext.data.SimpleStore({
fields: [{name: 'feeId',mapping:'feeId'},{name: 'feeName',mapping:'feeName'},{name: 'spec',mapping:'spec'},
{name: 'unit',mapping:'unit'},{name: 'price',mapping:'price'},{name: 'yibao',mapping:'yibao'}],
data:feeNameData
}),displayField: 'feeName', valueField: 'feeId', mode: 'local',allowBlank: false,
editable: true, hideTrigger:false, selectOnFocus: true,forceSelection: true,triggerAction: 'all',
listeners:{
beforequery: function(qe){
var keys = new Array();
keys[keys.length] = 'name';
keys[keys.length] = 'wubicode';
keys[keys.length] = 'pinyincode';
return filterCombobox(qe,keys);
}
}
})
(2)//b被调方法
function filterCombobox(qe,keys){
//combo,query,forceAll,cancel
var combo = qe.combo;
var q = qe.query;
var forceAll = qe.forceAll;
if(forceAll === true || (q.length >= combo.minChars)){
if(combo.lastQuery !== q){
combo.lastQuery = q;
if(combo.mode == 'local'){
combo.selectedIndex = -1;
if(forceAll){
combo.store.clearFilter();
}else{//写自己的模糊过滤条件
combo.store.filterBy(function(record,id){
var result = false;
if(keys && keys.length > 0){
for(var j=0; j=keys.length; j++){
var text = record.get(keys[i]);
var val=combo.getValue();
//过滤掉与输入框的值相等的记录
if(text==val){
return false;
}
result = (text.indexOf(q)!= -1);
if(result == true){
break;
}
}
}else{
var text = record.get(combo.displayField);
var val=combo.getValue();
//过滤掉与输入框的值相等的记录
if(text==val){
return false;
}
result = (text.indexOf(q)!= -1);
}
return result;
});
}
combo.onLoad();
}else{
combo.store.baseParams[combo.queryParam] = q;
combo.store.load({
params: combo.getParams(q)
});
combo.expand();
}
}else{
combo.selectedIndex = -1;
combo.onLoad();
}
}
return false;
}
注:jQuery.Hz2Py-min.js也提供中文转拼音 只能是input
二. //easyUi
(1) $('#' + comboxId).combobox({
url: url,
valueField: 'code_value',
textField: 'code_name',
multiple: true,
value: '',
editable: true,
panelHeight: 'auto',
filter:filterCombo
})
(2) function filterCombo(q, row) {
var keys = new Array();
keys[keys.length] = 'code_name';
keys[keys.length] = 'code_value';
return filterComboboxData(q, row, keys);
}
(3) function filterComboboxData(q, row, keys) {
var result;
if (keys && keys.length > 0) {
for (var i = 0; i < keys.length; i++) {
if(escape(q).indexOf("%u") != -1) {//汉字
result = row[keys[i]].indexOf(q) > -1;
} else {
result = ConvertPinyin(row[keys[i]]).indexOf(q) > -1;
}
if (result == true) {
return true;
}
}
} else {
var opts = $(this).combobox('options');
return row[opts.textField].indexOf(q) > -1;
}
}
//ext
(1)
new Ext.form.ComboBox({
store: new Ext.data.SimpleStore({
fields: [{name: 'feeId',mapping:'feeId'},{name: 'feeName',mapping:'feeName'},{name: 'spec',mapping:'spec'},
{name: 'unit',mapping:'unit'},{name: 'price',mapping:'price'},{name: 'yibao',mapping:'yibao'}],
data:feeNameData
}),displayField: 'feeName', valueField: 'feeId', mode: 'local',allowBlank: false,
editable: true, hideTrigger:false, selectOnFocus: true,forceSelection: true,triggerAction: 'all',
listeners:{
beforequery: function(qe){
var keys = new Array();
keys[keys.length] = 'name';
keys[keys.length] = 'wubicode';
keys[keys.length] = 'pinyincode';
return filterCombobox(qe,keys);
}
}
})
(2)//b被调方法
function filterCombobox(qe,keys){
//combo,query,forceAll,cancel
var combo = qe.combo;
var q = qe.query;
var forceAll = qe.forceAll;
if(forceAll === true || (q.length >= combo.minChars)){
if(combo.lastQuery !== q){
combo.lastQuery = q;
if(combo.mode == 'local'){
combo.selectedIndex = -1;
if(forceAll){
combo.store.clearFilter();
}else{//写自己的模糊过滤条件
combo.store.filterBy(function(record,id){
var result = false;
if(keys && keys.length > 0){
for(var j=0; j=keys.length; j++){
var text = record.get(keys[i]);
var val=combo.getValue();
//过滤掉与输入框的值相等的记录
if(text==val){
return false;
}
result = (text.indexOf(q)!= -1);
if(result == true){
break;
}
}
}else{
var text = record.get(combo.displayField);
var val=combo.getValue();
//过滤掉与输入框的值相等的记录
if(text==val){
return false;
}
result = (text.indexOf(q)!= -1);
}
return result;
});
}
combo.onLoad();
}else{
combo.store.baseParams[combo.queryParam] = q;
combo.store.load({
params: combo.getParams(q)
});
combo.expand();
}
}else{
combo.selectedIndex = -1;
combo.onLoad();
}
}
return false;
}
注:jQuery.Hz2Py-min.js也提供中文转拼音 只能是input
相关文章推荐
- sqlserver 模糊查询常用方法
- ASP在ACCESS中模糊查询"内存溢出"的解决方法
- mysql模糊查询like和regexp小结
- Access模糊查询查不到数据的解决方法
- asp.net 多字段模糊查询代码
- mysql中模糊查询的四种用法介绍
- MySQL单表多关键字模糊查询的实现方法
- SQL 时间类型的模糊查询
- MySql like模糊查询通配符使用详细介绍
- 有关SQL模糊查询
- SqlServer使用 case when 解决多条件模糊查询问题
- C语言之字符串模糊查询方法的实现
- ASP.NET实现按拼音码模糊查询的方法
- SQL查询语句通配符与ACCESS模糊查询like的解决方法
- MySql官方手册学习笔记2 MySql的模糊查询和正则表达式
- 简单的模糊查询包调用(类似百度)
- SQL 模糊查询
- ORACLE如何使用模糊查询(如何实现关键字搜索)
- extjs4 查询功能(模糊查询)以及 Ext.apply的用法
- CoreData模糊查询