• Introduction
  • Getting Started
  • Native Components
    • Animation
    • Buttons
    • Chartsupdated
    • Data Query
    • Data Tools
    • Date Inputs
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Form
    • Gauges
    • Grid
    • Icons
    • Indicators
    • Inputs
    • Labels
    • Layoutupdated
    • ListBox
    • ListView
    • Notification
    • PDF Processing
    • Popup
    • Progress Bars
    • Scheduler
    • ScrollView
    • Tooltip
    • TreeList
    • TreeView
    • Upload
  • Wrapper Components
  • Sample Applications
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Changelog
  • FAQ
  • Troubleshooting
New to Kendo UI for Vue? Start a free 30-day trial

Custom Editors

The Filter provides an option to define the way each filter parameter will be passed to the component. With this functionality, the value of a text field, for example, can be entered through an Input element or selected from a DropDownList, ComboBox, or other Kendo UI for Vue Native component.

Built-in Editors

The @progress/kendo-vue-data-tools package provides a number of built-in filters that can be used as custom editors for the different Filter fields. Here is a list of the built-in filters.

View Source
Change Theme:

Custom Component Editors

The below example demonstrates how we can use the ComboBox and DropDownList components as custom field editors in the Filter component. The example uses the filterRender property of the FieldSettings.

View Source
Change Theme:

Add filter expression and see that editor of the Product Name field is a DropDownList and the editor of the Quantity Per Unit field is a ComboBox.