JSFiddle - React, Tailwind, and code Playground

by valchev

HTML

<script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.mobile.all.min.css">
<div id="example">
    <input type="text" id="foo" 
        name="foo" 
        class="k-textbox" 
        required
        data-bind="attr: { validationMessage: msg} "/>
    <br />
    <button id="check">Check</button>
</div>

JavaScript

var validator = $("#example").kendoValidator().data("kendoValidator");

var viewModel = kendo.observable({
    msg: "Please enter something"
});

$("#check").click(function() {
    console.log(validator.validate());
});
    
kendo.bind($("#example"), viewModel);

viewModel.set("msg", "another message");