Native Components
    Wrapper Components
      Introduction
    • Barcodes
    • Buttons
    • Charts
    • Chat
    • DataSource
    • Date Inputs
    • Diagram
    • Dialog
    • Dropdowns
    • DropDownTree
    • Editor
    • Gantt
    • Gauges
    • Grid (wrapper)
    • Inputs
    • Layout
    • List Views
    • ListBox
    • Map
    • MediaPlayer
    • PivotGrid
    • Popups
    • Scheduler
    • ScrollView
    • Spreadsheet
    • TreeList
    • TreeMap
    • TreeView
    • Upload
    • Validator
    • Window
    • Framework & Features
    • Globalization
    • Accessibility
    • Troubleshooting
    Styling & Themes
    Common Features
    Project Setup
    Changelog

Validator

The Validator receives its options through the v-kendo-validator directive. All available options for the Kendo Validator widget are available as options for the directive.

<form id="ticketsForm" ref="myForm" v-kendo-validator="setup" @submit.prevent="onSubmit">
 ...
</form>

...

new Vue({
    data: {
        setup: {
            rules: {
                greaterdate (input) {
                    if (input.is("[name='RetireDate'") && input.val() != "") {
                        var date = kendo.parseDate(input.val()),
                                            otherDate = kendo.parseDate(kendo.jQuery("[name='HireDate']").val());
                        return otherDate == null || otherDate.getTime() < date.getTime();
                    }
                    return true;
                }
            },
            messages: {
                greaterdate: 'Retire date should be greater than Hire date'
            }
        }
});

In this article

Not finding the help you need?