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="intro" >
    <H3>TOURS</H3>
    <div id="listView"></div>
    <div id="pager" class="k-pager-wrap"></div>
</div>

<script type="text/x-kendo-tmpl" id="template">
  <div class="product">
        <h3>${tit_esp}</h3>
        <dl>
            <dt>Adulto: </dt>
            <dd>$ ${rate_adult}</dd>
        </dl>
  </div>
  <hr />
</script>

JavaScript

var dataSource = new kendo.data.DataSource({
    transport: {
        read: {
            type: "POST",
            url: "/echo/json/",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            data: { //using jsFiddle echo service to simulate Ajax request
                json: JSON.stringify({
                    "data": [
                        {
                            "recid": "22",
                            "tit_esp": "CHICHEN-ITZA CLASICO",
                            "main_pic": "big2.jpg",
                            "rate_adult": "50"
                        },
                        {
                            "recid": "18",
                            "tit_esp": "CHICHEN-ITZA LUZ Y SONIDO",
                            "main_pic": "big3.jpg",
                            "rate_adult": "60"
                        },
                        {
                            "recid": "11",
                            "tit_esp": "CHICHEN-ITZA PLUS",
                            "main_pic": "tchclB.JPG",
                            "rate_adult": "60"
                        },
                        {
                            "recid": "14",
                            "tit_esp": "COBA ENCUENTRO MAYA",
                            "main_pic": "1404B.jpg",
                            "rate_adult": "55"
                        },
                        {
                            "recid": "29",
                            "tit_esp": "COZUMEL",
                            "main_pic": "cozumel.jpg",
                            "rate_adult": "80"
                        },
                        {
                            "recid": "37",
                            "tit_esp": "RIO LAGARTOS",
                            "main_pic": "riolag.jpg",
                            "rate_adult": "95"
                        },
                        {
                            "recid": "23",
                      ...