var ds;
var grid;

function ProccessResultGrid()
{
    var el = document.getElementById('searchresult');
    if (el)
    {
        if (el.style.display != 'none')
        {
            //var grid = new Ext.grid.TableGrid(el, {
            var myViewConfig = {
                    afterRender: function()
                    {
                        this.constructor.prototype.afterRender.apply(this, arguments);
                        this.grid.getSelectionModel().selectFirstRow();
                    }
                }

            var myKeyHandler = { key: [10, 13], fn: function(e) { gridalert(grid);} }    
                
            grid = new Ext.grid.TableGrid(el, {
                frame: true,
                title: 'Zoek resultaat',
                iconCls: 'icon-grid',
                renderTo: document.body,
                stripeRows: true, // stripe alternate rows
                keys: myKeyHandler,
                sm: new Ext.grid.RowSelectionModel({ singleSelect: true }),
                viewConfig: myViewConfig
            });
            //grid.setTitle('dummy test');
            //grid.setKeys = { key: [10, 13], fn: function(e) { gridalert(grid); } };
            grid.on('rowdblclick', function(e)
            {
                gridalert(grid);
            });

            grid.render();

            grid.getView().focusEl.focus();
//            var sm = grid.getSelectionModel();
//            sm.selectFirstRow.defer(1, sm);
//            grid.getView().focusRow(0);(



        };
    };
};


function gridalert(grid)
{
    var rec = grid.getSelectionModel().getSelected();
    var fieldName = grid.getColumnModel().getDataIndex(4);
    alert("U heeft gekozen voor [" + fieldName + "]" + rec.get(fieldName));
}



/*
* Ext JS Library 2.2
* Copyright(c) 2006-2008, Ext JS, LLC.
* licensing@extjs.com
* 
* http://extjs.com/license
*/

/**
* @class Ext.grid.TableGrid
* @extends Ext.grid.Grid
* A Grid which creates itself from an existing HTML table element.
* @constructor
* @param {String/HTMLElement/Ext.Element} table The table element from which this grid will be created - 
* The table MUST have some type of size defined for the grid to fill. The container will be 
* automatically set to position relative if it isn't already.
* @param {Object} config A config object that sets properties on this grid and has two additional (optional)
* properties: fields and columns which allow for customizing data fields and columns for this grid.
* @history
* 2007-03-01 Original version by Nige "Animal" White
* 2007-03-10 jvs Slightly refactored to reuse existing classes
*/
Ext.grid.TableGrid = function(table, config)
{
    config = config || {};
    Ext.apply(this, config);
    var cf = config.fields || [], ch = config.columns || [];
    table = Ext.get(table);

    var ct = table.insertSibling();

    var fields = [], cols = [];
    var headers = table.query("thead th");
    for (var i = 0, h; h = headers[i]; i++)
    {
        var text = h.innerHTML;
        var name = 'tcol-' + i;

        fields.push(Ext.applyIf(cf[i] || {}, {
            name: name,
            mapping: 'td:nth(' + (i + 1) + ')/@innerHTML'
        }));

        cols.push(Ext.applyIf(ch[i] || {}, {
            'header': text,
            'dataIndex': name,
            'width': h.offsetWidth,
            'tooltip': h.title,
            'sortable': true
        }));
    }

    //var ds = new Ext.data.Store({
    ds = new Ext.data.Store({
        reader: new Ext.data.XmlReader({
            record: 'tbody tr'
        }, fields)
    });

    ds.loadData(table.dom);

    var cm = new Ext.grid.ColumnModel(cols);

    if (config.width || config.height)
    {
        ct.setSize(config.width || 'auto', config.height || 'auto');
    } else
    {
        ct.setWidth(table.getWidth());
    }

    if (config.remove !== false)
    {
        table.remove();
    }

    Ext.applyIf(this, {
        'ds': ds,
        'cm': cm,
        'sm': new Ext.grid.RowSelectionModel(),
        autoHeight: true,
        autoWidth: false
    });
    Ext.grid.TableGrid.superclass.constructor.call(this, ct, {});
};

Ext.extend(Ext.grid.TableGrid, Ext.grid.GridPanel);