filterable.messagesObject
The text messages that are displayed in the filter menu. Use it to customize or localize the filter menu messages.
Example - customizing the filter menu messages
<div id="treelist"></div>
<script>
$("#treelist").kendoTreeList({
columns: [
{ field: "lastName" },
{ field: "position" },
{ field: "extension" }
],
dataSource: [
{ id: 1, parentId: null, lastName: "Jackson", position: "CEO", extension: 8241 },
{ id: 2, parentId: 1, lastName: "Weber", position: " VP, Engineering", extension: 8342 }
],
filterable: {
messages: {
and: "and",
or: "or",
filter: "Apply filter",
clear: "Clear filter"
}
}
});
</script>
filterable.messages.andString(default: "And")
The text of the option which represents the AND logical operation.
Example - setting the AND message
<div id="treelist"></div>
<script>
$("#treelist").kendoTreeList({
columns: [
{ field: "lastName" },
{ field: "position" },
{ field: "extension" }
],
dataSource: [
{ id: 1, parentId: null, lastName: "Jackson", position: "CEO", extension: 8241 },
{ id: 2, parentId: 1, lastName: "Weber", position: " VP, Engineering", extension: 8342 }
],
filterable: {
messages: {
and: "and"
}
}
});
</script>
filterable.messages.clearString(default: "Clear")
The text of the button which clears the filter.
Example - setting the clear message
<div id="treelist"></div>
<script>
$("#treelist").kendoTreeList({
columns: [
{ field: "lastName" },
{ field: "position" },
{ field: "extension" }
],
dataSource: [
{ id: 1, parentId: null, lastName: "Jackson", position: "CEO", extension: 8241 },
{ id: 2, parentId: 1, lastName: "Weber", position: " VP, Engineering", extension: 8342 }
],
filterable: {
messages: {
clear: "Clear filter"
}
}
});
</script>
filterable.messages.filterString(default: "Filter")
The text of the button which applies the filter.
Example - setting the filter message
<div id="treelist"></div>
<script>
$("#treelist").kendoTreeList({
columns: [
{ field: "lastName" },
{ field: "position" },
{ field: "extension" }
],
dataSource: [
{ id: 1, parentId: null, lastName: "Jackson", position: "CEO", extension: 8241 },
{ id: 2, parentId: 1, lastName: "Weber", position: " VP, Engineering", extension: 8342 }
],
filterable: {
messages: {
filter: "Apply filter"
}
}
});
</script>
filterable.messages.infoString(default: "Show items with value that: ")
The text of the information message on top of the filter menu.
Example - setting the info message
<div id="treelist"></div>
<script>
$("#treelist").kendoTreeList({
columns: [
{ field: "lastName" },
{ field: "position" },
{ field: "extension" }
],
dataSource: [
{ id: 1, parentId: null, lastName: "Jackson", position: "CEO", extension: 8241 },
{ id: 2, parentId: 1, lastName: "Weber", position: " VP, Engineering", extension: 8342 }
],
filterable: {
messages: {
info: "Filter by: "
}
}
});
</script>
filterable.messages.titleString(default: "Show items with value that: ")
The text that is rendered for the title attribute of the filter menu form.
Example
<div id="treelist"></div>
<script>
$("#treelist").kendoTreeList({
columns: [
{ field: "Name" },
{ field: "Position" }
],
dataSource: [
{ id: 1, Name: "Daryl Sweeney", Position: "CEO", parentId: null },
{ id: 2, Name: "Guy Wooten", Position: "Chief Technical Officer", parentId: 1 }
],
filterable: {
messages: {
title: "Filter by value:"
}
}
});
</script>
filterable.messages.isFalseString(default: "is false")
The text of the radio button for false values. Displayed when the user filters Boolean fields.
Example - setting the isFalse message
<div id="treelist"></div>
<script>
$("#treelist").kendoTreeList({
columns: [
{ field: "lastName" },
{ field: "position" },
{ field: "available" }
],
dataSource: {
data: [
{ id: 1, parentId: null, lastName: "Jackson", position: "CEO", available: true },
{ id: 2, parentId: 1, lastName: "Weber", position: " VP, Engineering", available: false }
],
schema: {
model: {
fields: {
available: {type: "boolean"}
}
}
}
},
filterable: {
messages: {
isFalse: "False"
}
}
});
</script>
filterable.messages.isTrueString(default: "is true")
The text of the radio button for true values. Displayed when the user filters Boolean fields.
Example - setting the isTrue message
<div id="treelist"></div>
<script>
$("#treelist").kendoTreeList({
columns: [
{ field: "lastName" },
{ field: "position" },
{ field: "available" }
],
dataSource: {
data: [
{ id: 1, parentId: null, lastName: "Jackson", position: "CEO", available: true },
{ id: 2, parentId: 1, lastName: "Weber", position: " VP, Engineering", available: false }
],
schema: {
model: {
fields: {
available: {type: "boolean"}
}
}
}
},
filterable: {
messages: {
isTrue: "True"
}
}
});
</script>
filterable.messages.orString(default: "Or")
The text of the option which represents the OR logical operation.
Example - setting the or message
<div id="treelist"></div>
<script>
$("#treelist").kendoTreeList({
columns: [
{ field: "lastName" },
{ field: "position" },
{ field: "extension" }
],
dataSource: [
{ id: 1, parentId: null, lastName: "Jackson", position: "CEO", extension: 8241 },
{ id: 2, parentId: 1, lastName: "Weber", position: " VP, Engineering", extension: 8342 }
],
filterable: true,
filterable: {
messages: {
or: "or"
}
}
});
</script>