Kendo UI Grid incell editing with keyboard up and down arrows

by LeeMellinger

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">
<!--Add Markup for the AutoComplete Widget-->
<p>
    Savings: 
  <div id="list">
  </div>
</p>

CSS

td {
    white-space: nowrap;
}

JavaScript

var savings = [ 
    { month: "January", saving: "$200", kind: 1 },
    { month: "March", saving: "$100", kind: 1 },
    { month: "March sdjhf as dfjh;as", saving: "$100", kind: 1 },
    { month: "March", saving: "$100", kind: 1 },
    { month: "March", saving: "$10000", kind: 1 },
    { month: "December", saving: "$100", kind: 1 },
    { month: "March", saving: "$100", kind: 1 },
    { month: "March", saving: "$100", kind: 2 },
    { month: "March", saving: "$100", kind: 3 },
    { month: "March", saving: "$100", kind: 1 } ];

var savingsDataSource = new kendo.data.DataSource({
    data: savings
});

$(function() {
    $("#list").kendoGrid({    
          filterable: {
              mode: "row",
              extra: false,
              showOperators: false
          },
					dataSource: savingsDataSource,
          columns:[
            { field: "month", title: "Month" },
            { field: "saving" },
            { field: "kind", values: [{value:1, text:"Kind1"},{value:2, text:"Kind2"},{value:3, text:"Kind3"}] }
            ],        
        navigatable: true,
        edit: edit
    });
});

var specialKeys = [kendo.keys.UP, kendo.keys.DOWN];
function edit(e) {
    var ddl = e.container.find(".k-dropdown").focus();
    ddl.keydown(function(e) {
        
        if ($.inArray(e.keyCode, specialKeys) > 0) {
            e.stopImmediatePropagation();
        }
    });
}