Kendo Grid with No Records Message

Kendo Grid with No Records Message

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.621/styles/kendo.common.min.css">
<script src="http://cdn.kendostatic.com/2012.2.621/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.621/styles/kendo.mobile.all.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.621/styles/kendo.default.min.css">
<script src="http://dynamic.mavistech.com/scripts/KendoGridNoRecordsMsg.js"></script>
<div id="grid"></div>
<br/>
<div>
    <input id='loadEmtpyData' type='button' value='Load empty data'></input>
    <input id='reloadData' type='button' value='Reload data'></input>
</div>
<div>Look at "KendoGridNoRecordsMsg.js" for the implementation code</div>

JavaScript

$(function () {

    var sharedDataSource = new kendo.data.DataSource({
        data: [{
            id: 1,
            value: 10,
            item: "Item1"
        }, {
            id: 2,
            value: 12,
            item: "Item2"
        }, {
            id: 3,
            value: 15,
            item: "Item3"
        }, {
            id: 4,
            value: 18,
            item: "Item4"
        }, {
            id: 5,
            value: 22,
            item: "Item5"
        }, {
            id: 6,
            value: 11,
            item: "Item6"
        }],
        schema: {
            model: {
                id: "id",
                fields: {
                    id: {
                        type: "number",
                        editable: false
                    },
                    value: {
                        type: "number"
                    },
                    item: {
                        type: "string"
                    }
                }
            }
        }
    });
    $("#grid").kendoGrid({
        dataSource: sharedDataSource,
        autoBind: false,
        editable: true,
        toolbar: ["save", "cancel"],
        noRecords: {template: "Perhaps"}
    });
    sharedDataSource.read();

    $('#loadEmtpyData').click(function () {
        sharedDataSource.data([]);
    });
    $('#reloadData').click(function () {
        sharedDataSource.read();
    });
});