KendoUI目前最新提供KendoUIforjQuery、KendoUIforAngular、KendoUISupportforReact和KendoUISupportforVue四个控件。KendoUIforjQuery是创建现代Web应用程序的完整UI库。
KendoUIFilter小部件是一个统一的控件,用于筛选具有数据源的数据绑定组件。
概述
全球化进程结合组件消息的翻译(本地化)和使其适应特定的文化(国际化和支持从右到左),通过过滤器消息的本地化可以启用过滤器的全球化功能。
本地化
过滤器提供用于定义其过滤器运算符(例如包含、等于或大于)和逻辑消息(例如,AND和OR)的文本选项。
要本地化消息,请在messages字段中设置所需的字符串。要本地化运算符的名称,请列出可用的运算符,然后在operators字段中设置其文本。
divid="filter"/divulid="listView"/ul
scripttype="text/x-kendo-template"id="item"listrong#=name#/strong,aged#=age#,isonvacation:#=isOnLeave#/li/script
script(document).ready(function(){vardataSource=newkendo.data.DataSource({data:[{name:"JaneDoe",age:"25",isOnLeave:false},{name:"JohnDoe",age:"33",isOnLeave:true},{name:"JohnSmith",age:"37",isOnLeave:true},{name:"NathanDoe",age:42,isOnLeave:false}],schema:{model:{fields:{name:{type:"string"},age:{type:"number"},isOnLeave:{type:"boolean"}}}}});
("#filter").kendoFilter({dataSource:dataSource,
messages:{or:"OR",//TheORmainlogictext.and:"AND",//TheANDmainlogictext.apply:"SetFilter"//TheAPPLYbuttontext.},operators:{string:{eq:kendo.ui.Filter.fn.options.operators.string.eq,//TakethedefaultKendoUItext.contains:"PartiallyMatches"//Defineacustomtext.},number:{gte:"LargerThan",//Defineacustomtext.lt:kendo.ui.Filter.fn.options.operators.number.lt//TakethedefaultKendoUItext.}},
expressionPreview:true,//Showsatextpreviewofthefilterexpression.applyButton:true,//Showsthebuilt-inApplybutton.fields:[//Definingthefieldsisnotmandatory.Otherwise,theywillbetakenfromthedatasourceschema.//Ifyoudefinethefields,theirnamesandtypesmustmatchthedatasourcedefinition.{name:"name",type:"string",label:"Name"},{name:"age",type:"number",label:"Age"},{name:"isOnLeave",type:"boolean",label:"OnVacation"}],expression:{//defininganinitialfilterexpressionisnotrequiredlogic:"and",filters:[{field:"age",value:30,operator:"gte"},{field:"name",value:"Doe",operator:"contains"}]}}).data("kendoFilter").applyFilter();//Chainthemethodcalltoimmediatelyapplyfilteringafterthewidgetinitializationbecauseaninitialfilterisset.
("#listView").kendoListView({dataSource:dataSource,template:kendo.template(("#item").html())});});/script
公司名称:北京哲想软件有限公司
北京哲想软件官方网站:cogitosoft.