JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://dl.dropbox.com/u/40036711/Scripts/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://dl.dropbox.com/u/40036711/CSS/kendo.common.min.css">
<link rel="stylesheet" href="http://dl.dropbox.com/u/40036711/CSS/kendo.default.css">
<input type="text" id="twitter-search-text" placeholder="Start typing to search twitter..." value="37signals"/>
<button id="generateGrid">Search Twitter</button>
<br/>
<br/>
<b>Kendo Grid</b>
<br/>
<br/>
<div id="my-grid"></div>

CSS

body{font-family:Helvetica; font-size:11px;padding:10px;background:#f6f6f6;}
input, button{padding:5px;margin:3px 0;width:200px;}
.k-grid-header {
            height: 120px;
        }
        .k-grid th.k-header {
            height: 100px;
            word-wrap: hyphenate;
        }

JavaScript

//setup new datasource for tweets
var tweetDS = new kendo.data.DataSource({
    transport: {
        read: {
            url: "http://search.twitter.com/search.json",
            dataType: "jsonp",
            data: {
                q: function () {
                    return $('#twitter-search-text').val();
                }                             
            }
        }
    },
    schema: {
        data: "results"
    }
});

//setup grid to use tweet datasource
$("#my-grid").kendoGrid({
    dataSource: tweetDS,
    filterable: true,
    groupable: true,
    sortable: true,  
    columns: [
        { field: "from_user", title: "卡號", headerTemplate: '<span style="height:200px">卡號</span>', width:50px },
        { field: "text", title: "Tweet" },
        { field: "created_at", title: "Time" }
    ]
});

//bind/rebind
$('#generateGrid').on('click', function(){
    if($('#twitter-search-text').val() != ""){
        tweetDS.read();
    }
});

//BONUS!! Turn your grid into Kendo Instant :)
$('#twitter-search-text').on('keyup', function(){
    if($(this).val() != ""){
        tweetDS.read();
    }
});