kendo autoComplete 原始情况下是不支持多筛选条件的

$("#autocomplete").kendoAutoComplete({
filter: "contains"
});

依据autocomplete 提供的api能够知道使用filter有三种。各自是startswithendswith , contains。可是作为中文使用用户。我们该怎么办呢。非常多时候,我们希望搜索出来的东西能够通过汉字或者拼音过滤,可是原始的autocomplete是无法帮助我们实现这以功能的。

接下来我们改造下。基于autocomplete做一个多过滤条件的autocomplete

详细代码例如以下:

kendo.ui.plugin(kendo.ui.ComboBox.extend({
options: {
name: "MultiFilterComboBox"
},
_filterSource: function () {
this.dataSource.filter({
logic: "or",
filters: [
{ field: "code", operator: "contains", value: this.text() },
{ field: "name", operator: "contains", value: this.text() }
]
});
}
}));

用法:

$("#Nation").kendoMultiFilterComboBox({
placeholder: "民族...",
dataTextField: "name",
dataValueField: "name",
filter: "contains",
dataSource:[{name:'汉族',code:'hanzu'},<pre name="code" class="javascript" style="color: rgb(85, 85, 85); font-size: 14px; line-height: 21px;">name:'苗族',code:'miaozu'}

]});


html标签:

<input id="Nation"/>

如今我们就实现过组合过滤条件的autocomplete,演示样例仅仅是做了或运算,其它的运算也是能够的,大家能够灵活应用,开发自己的大脑。

kendo AutoComplete实现多筛选条件的更多相关文章

  1. sql之表连接 筛选条件放在 连接外和放在连接里的区别

    使用一个简单的例子,说明他们之间的区别 使用的表:[Sales.Orders]订单表和[Sales.Customers]客户表,和上一篇博客的表相同 业务要求:查询出 : 所有的用户 在 2012-1 ...

  2. vue的data的数据进行指定赋值,用于筛选条件的清空,或者管理系统添加成功后给部分数据赋值为空

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. jqgrid 表格中筛选条件的多选下拉,树形下拉 ;文本框清除插件;高级查询多条件动态筛选插件[自主开发]

    /** * @@desc 文本框清除按钮,如果isAutoWrap为false当前文本框父级必须是relative定位,boostrap参考input-group * @@author Bear.Ti ...

  4. 【html】前端实现筛选条件跳转

    之前与PHP的合作模式之一是前端这边负责写好静态页面交货. 那现在新进的公司,PHP说筛选由前端来实现. 嗯,好吧.实现就实现,多锻炼下咯. <div class="fliter&qu ...

  5. django orm 以列表作为筛选条件进行查询

    在Django的orm中进行查询操作时,可以通过传入列表,列表内的元素为索引值,作为一个筛选条件来进行行查询 from .models import UserInfo user_obj = UserI ...

  6. 在SharePoint列表中使用动态筛选条件[今日][Today]

    如果在SharePoint使用了日历控件或者其他列表中有时间字段,用户经常希望能够动态使用条件字段进行筛选,例如希望筛选出开始日期是今天的事件.未来三日的事件. SharePoint的列表筛选条件支持 ...

  7. sql的where条件转换成mongdb筛选条件

    解析字符串 filterModel1 and filterModel2 and (filterModel3 or filterModel4) 1.转换成mongo的筛选条件 /// <summa ...

  8. C# linq根据自定义筛选条件和所对应的数值进行筛选

    在软件应用中有时候会出现这样的界面:上面是利用多选框和下拉框组合的筛选条件.下面表格展示筛选后的数据.如下图 上面是筛选条件,表格是根据筛选条件筛选的结果. 如果表格不支持筛选功能.可以利用Linq对 ...

  9. vue 自定义 移动端筛选条件

    1.创建组件 components/FilterBar/FilterBar.vue <template> <div class="filterbar" :styl ...

随机推荐

  1. Linux添加用户组和删除用户组

    1.添加用户组使用groupadd命令添加用户组:groupadd group_name此操作需由系统管理员进行.2.删除用户组使用groupdel命令删除用户组:groupdel group_nam ...

  2. Linq学习(一)-初涉Linq

    一.何谓LINQ LINQ:Language Integrated Query语言集成查询,其本质是对ADO.NET结果集通过反射连同泛型特性转换成对象集,实现OR模型的转换 二.优点与缺点 优点:封 ...

  3. MVC系列学习(十)-生成URL与表单

    本次学习,在路由配置信息中,有两个路由规则,在网站第一次启动的时候,注册了两个路由表 1.动态生成url A.在路由规则中,因为Default在前面,所以最新找到该路由表,此时不管 自己定义的控制器名 ...

  4. 6.10---mybatis中两张表查询数据dao层

  5. 研磨JavaScript系列(五):奇妙的对象

    在JavaScript中,只有object和function两种东西有对象化的能力.我们先来说说函数的对象化能力. 任何一个函数都可以为其动态地添加或去除属性,这些属性可以是简单类型,可以是对象,也可 ...

  6. 关于debug.keystore文件用法以及错误处理

    在开发过程中需要频繁的为测试的同事签名apk,非常很麻烦,把默认debug.keystore文件替换成发布用(生产环境)的签名文件,不用频繁地签名apk文件了.      如果直接使用生产keysto ...

  7. Java中File对象的常用方法

    创建: 1.createNewFile()指定位置创建一个空文件,成功就返回true,如果已存在就不创建,然后返回false. 2.mkdir() 在指定位置创建一个单级文件夹. 3.mkdirs() ...

  8. 谷歌浏览器中a:link设置字体颜色无效问题

    <div id="box"> <a href="#">111111</a> <a href=""& ...

  9. 谷歌通过ajax获取本地JSON文件,为什么会提示跨域?

    在本地写了一段JSON代码,然后用ajax读取后,在浏览器打开,发现谷歌提示涉及到跨域问题, 但是跨域是由于协议,域名,端口中有一个不同,才会跨域,我在本地访问自己的文件,怎么和跨域扯上关系了?? 下 ...

  10. 27.7 并行语言集成查询(PLinq)

    static void Main() { ObsoleteMethods(Assembly.Load("mscorlib.dll")); Console.ReadKey(); } ...