Kendo

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2011.3.1007/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2011.3.1007/styles/kendo.kendo.min.css">
<script src="http://cdn.kendostatic.com/2011.3.1007/js/kendo.all.min.js"></script>
<table id="Table1" style="height: 450px">
                <thead>
                    <tr>
                        <th data-field="surName">Surname</th>
                        <th data-field="foreName">Forename</th>
                        <th data-field="dOB">DoB</th>
 
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>Smith</td><td>John</td><td>21/5/2001</td>
                    </tr>
</tbody>
</table>

CSS

#dt_rating
{
    list-style:none;
}
#dt_rating li
{
    float:left;
    width: 10px;
    height: 10px;
}
.rated
{    
    background: red;
}
.notrated
{
    background: blue;
}

JavaScript

var result = [];
     for (var i = 0; i <100; i++) {
         result.push( {
             surName: "surName" + i,
             foreName: "foreName" + i,
             dOB: new Date()
         });
     }
       
 
    //Data source
 
    var localDataSource = new kendo.data.DataSource({ 
        data: result, 
        pageSize: 50, 
        page:1,
        group: [ { field: "surName", dir: "desc" }, { field: "foreName", dir: "asc" } ]                                             
                                                     
                                                     
                                                     });
 
    $("#Table1").kendoGrid({
 
        columns: [{ field: "surName", title: "Surname" }, { field: "foreName", title: "Forename" }, { field: "dOB", title: "Date of Birth", template: '#= kendo.toString(dOB,"dd MMMM yyyy") #'}],         
 
        dataSource: localDataSource,
        groupable: true,
        scrollable: false,
        sortable: true,
        pageable: true,
        height: 450,
        selectable: true
    });