[CLOSED] GridPanel / Renderer : Property "undefined"?

[wagger]

Hey,
im trying to get an image in a column based on a value in the record. But its not working.

I get an undefined error: "Cannot read property 'Type' of undefined" . What am I missing in here?

// .... js 
var companyRenderer = function (value, record) {
    var tpl = "<img src='{0}' />";
    alert(record.data.Type); // ERROR: Cannot read property 'Type' of undefined
};

// ....

<ext:GridPanel ID="GridPanel1" runat="server" Title="asd" AutoHeight="true">
    <Store> 
        <ext:Store ID="Store1" runat="server" >
            <Reader>
                <ext:ArrayReader>
                    <Fields>
                        <ext:RecordField Name="Type"></ext:RecordField>
                        <ext:RecordField Name="Customer"></ext:RecordField>
                    </Fields>
                </ext:ArrayReader>
            </Reader>
        </ext:Store>
    </Store>
    <ColumnModel ID="ColumnModel1" runat="server">
        <Columns>
            <ext:Column DataIndex="Type" Width="16">
                <Renderer Fn="companyRenderer"/>
            </ext:Column>
            <ext:Column Header="Cust" DataIndex="Customer"/>
        </Columns>
    </ColumnModel>
</ext:GridPanel>

[Vladimir]

Hi,

'record' is third argument, second argument is 'metadata'

renderer : Mixed
For an alternative to specifying a renderer see xtype
Optional. A renderer is an 'interceptor' method which can be used transform data (value, appearance, etc.) before it is rendered). This may be specified in either of three ways:
A renderer function used to return HTML markup for a cell given the cell's data value.
A string which references a property name of the Ext.util.Format class which provides a renderer function.
An object specifying both the renderer function, and its execution scope (this reference) e.g.:
{
fn: this.gridRenderer,
scope: this
}
If not specified, the default renderer uses the raw data value.
For information about the renderer function (passed parameters, etc.), see Ext.grid.ColumnModel.setRenderer. An example of specifying renderer function inline:
var companyColumn = {
header: 'Company Name',
dataIndex: 'company',
renderer: function(value, metaData, record, rowIndex, colIndex, store) {
// provide the logic depending on business rules
// name of your own choosing to manipulate the cell depending upon
// the data in the underlying Record object.
if (value == 'whatever') {
//metaData.css : String : A CSS class name to add to the TD element of the cell.
//metaData.attr : String : An html attribute definition string to apply to
// the data container element within the table
// cell (e.g. 'style="color:red;"').
metaData.css = 'name-of-css-class-you-will-define';
}
return value;
}
}

[wagger]

Aha, i see! I used the code you posted here:
http://forums.ext.net/showthread.php...ll=1#post55124

and you wrote

var companyRenderer = function (value, record) {

thus the misunderstanding =)

[Vladimir]

Hi,

Yes, it was my mistake, Daniil corrected me in the next post

[wagger]

Ah, ok =)

Thanks for the quick answer as always!