JSFiddle - React, Tailwind, and code Playground

by ZenMaster

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.4.1/knockout.mapping.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/knockout-validation/1.0.2/knockout.validation.js"></script>
<div>
    <input type="text" data-bind="value: value">
    <p data-bind="validationMessage: value"></p>
</div>

JavaScript

/*ko.validation.init({
    insertMessages: false
});*/

var data = {
    value: ''
};

var viewModel = ko.mapping.fromJS(data);

viewModel.value.extend({
    required: true,
    minLength: 3
});

ko.applyBindings(viewModel);

ko.validation.group(viewModel);
viewModel.errors.showAllMessages();