JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.kendostatic.com/2013.1.226/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.1.226/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.1.226/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.1.226/styles/kendo.mobile.all.min.css">
<div id="fieldTab">
    <button data-bind="click: add">Add</button>
    <button data-bind="click: remove">Remove Last</button>
    <div data-bind="source: fields" data-template="fieldsTemplate" />
    
</div>

<script id="fieldsTemplate" type="text/x-kendo-template">
    <div>
        <input name="field1#= fieldSys #" required data-bind="value: field1" />
        <br />
        <input name="field2#= fieldSys #" required data-bind="value: field2" />
        <br />
        <input name="field3#= fieldSys #" required data-bind="value: field3" /> 
        <br />
        <button data-bind="click: clear">Clear</button><br />
    </div>
</script>

JavaScript

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

var data = [
    {'fieldSys': 1, 'field1': 1, 'field2': 2, 'field3': 3},
    {'fieldSys': 2, 'field1': 4, 'field2': 5, 'field3': 6}
]

var Field = kendo.data.Model.define(
{
    id: "fieldSys",
    fields:
    {
        fieldSys: { type: "number" },
        field1: { type: "number" },
        field2: { type: "number" },
        field3: { type: "number" }
    }
}); 

var Fields = new kendo.data.DataSource(
{
    transport:
    {
        read: function (options) {
            options.success({ d: data });
        }
    },
    schema:
    {
        data: "d",
        model: Field
    },
    change: function (e) {
        this.parent().set("fields", this.data());
    }
});

viewModel = kendo.observable({
    add: function (e) {
        alert('Added but does not reflect in UI');
        viewModel.fields.push({});
    },
    remove: function (e) {
        alert('Removed but does not reflect in UI');
        viewModel.fields.pop();
    },
    clear: function (e) {
        var field = e.data;
        field.set('field1', null);
        field.set('field2', null);
        field.set('field3', null);
    },
    dataSource: Fields,
    fields: []
});
Fields.read();
kendo.bind(fieldTab, viewModel);