New to Kendo UI for jQuery? Download free 30-day trial

Focus Column Header Input When navigatable Is true


Product Progress® Kendo UI® Grid for jQuery
Product Version Created with the 2017.3.1026 version


How can I allow the user to click on an input in the headerTemplate of a column when the navigatable property of the Kendo UI Grid is true?


To focus the input, prevent the mousedown event handler from bubbling to the header.

<div id="grid"></div>
        columns: [{
            field: "name",
            headerTemplate: '<input id="myID" type="text" value="text" />'
        navigatable: true,
        dataBound: function(e) {
            e.sender.thead.on("mousedown", "input", function(e) {
        dataSource: [{
            name: "Jane Doe"
        }, {
            name: "John Doe"
In this article