ExtJs: Ext.Grid from an unformatted HTML table

Recently I came across an interesting example of how to make Ext.Grid from an unformatted plate. Everything is done literally in one line. First, create an HTML table:

Barney rubble	32	Male
Fred flintstone	33	Male
Betty rubble	32	Female
Pebbles	1	Female
Bamm bamm	2	Male

Then create a button:

Create grid

We got the button code itself:

/ *!
 * Ext JS Library 3.0+
 * Copyright (c) 2006-2009 Ext JS, LLC
 * licensing@extjs.com
 * http://www.extjs.com/license
 * /
Ext.onReady (function () {
    // find the button
    var btn = Ext.get ("create-grid");
    // button click handler
    btn.on ("click", function () {
        btn.dom.disabled = true;
        // create a table
        var grid = new Ext.ux.grid.TableGrid ("the-table", {stripeRows: true});
        grid.render (); // show the table
    }, false, {
        single: true
    }); // execute only once
});

The result after clicking the button: Download the demo "HTML 2 Ext.Grid" here