JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.kendostatic.com/2013.2.716/js/kendo.web.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.default.min.css">
<div id="grid1"></div>

JavaScript

var grid = $('#grid1').kendoGrid({
            selectable: true,
            editable: true,
            sortable: true,
            pageable: true,
            dataSource: {
                pageSize: 10,
                schema: {
                    model: {
                        id: "Id",
                        fields: {
                            ItemNumber: { editable: false, type: "string" },
                            Color: { editable: false, type: "string" },
                            BatchNumber: { editable: false, type: "string" },
                            Quantity: { editable: false, type: "number" },
                            Width: { editable: false, type: "number" },
                            UOM: { editable: false, type: "number" },
                            Allocated: {
                                editable: true,
                                type: "number",
                                validation: {
                                    required: false,
                                    validIP: function (input1) {
                                        if(input1.is("[data-role='numerictextbox']")) {
                                            input1.attr('data-validIP-msg', 'Invalid allocation');
                                            return $.isNumeric(input1.val());
                                        } else {
                                            return true;   
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            },
            columns: [{
                field: "ItemNumber",
                title: "Sup Roll/Box No."
            }, {
                field: "ItemDescription",
                title: "Sup Item Description"
            }, {
                field: "Color",
                title: "Sup Color"
            }, {
               ...