Kendo Grid inside Window scroll with arrow keys

Related to this Stack Overflow question: http://stackoverflow.com/questions/26511702/arrow-keys-and-scrolling-issues-with-kendo-ui-grid-inside-window

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.318/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.318/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2014.1.318/js/kendo.all.min.js"></script>
<div id="example">
    <div id="myWindow">
        <div id="grid"></div>
    </div>
</div>

JavaScript

var myWindow = $('#myWindow').kendoWindow({
    title: "My Window",
    width: 500,
    height: 400,
    open: function() {
        $('#grid').kendoGrid({
            dataSource: {
                type: "odata",
                transport: {
                    read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Orders"
                },
                pageSize: 10
            },
            height: 375,
            navigatable:true,
            pageable: true,
            columns: [
                { field:"OrderID", width: 300 },
                { field: "Freight", width: 300 },
                { field: "OrderDate", width: 300 },
                { field: "ShipName", width: 300 },
                { field: "ShipCity", width: 300 }
            ]
        });
    }
});

myWindow.open();