JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://docs.sencha.com/ext-js/4-0/extjs/resources/css/ext-all.css">
<div style="height:2000px;padding:10px;">
    <a href="javascript://" id="focuser">Click here to jump to your grid!</a>
</div>

JavaScript

var win = Ext.create('Ext.window.Window', {
    width: 200,
    height: 150,
    title: 'Grid',
    x: 10,
    y: 1000,
    items: Ext.create('Ext.grid.Panel', {
        border: false,
        store: Ext.create('Ext.data.ArrayStore', {
            fields: ['id', 'name'],
            data: [[0, 'John'], [1, 'Doe'], [2, 'Mary'], [3, 'Maru']]
        }),
        columns: [{
            dataIndex: 'id',
            header: 'ID'
        },{
            dataIndex: 'name',
            header: 'Name',
            flex: 1
        }]
    })
}).show();

Ext.get('focuser').on('click', function() {
    win.items.get(0).getView().el.focus();
});