JSFiddle - React, Tailwind, and code Playground

by inikolova

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2012.1.515/js/kendo.all.min.js"></script>
<div id="grid" data-pageable='true' data-columns='["text"]' data-bind="source: gridData" data-role="grid"></div>

CSS

.selected{
  background: red;
  color: white;    
}

JavaScript

var dataSource = new kendo.data.DataSource({
    transport: {
        read: {
            url: "http://search.twitter.com/search.json",
            dataType: "jsonp",
            data: {
                q: "kendoui"
            }
        }
    },
    schema: {
        data: "results",
        total: function(response) {
            return response.results.length;
        }
    },
    pageSize: 4
});

var viewModel = kendo.observable({
    gridData: dataSource
});
        
kendo.bind(document.body, viewModel);