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

  1. #1

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

    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">
            <ext:Store ID="Store1" runat="server" >
                            <ext:RecordField Name="Type"></ext:RecordField>
                            <ext:RecordField Name="Customer"></ext:RecordField>
        <ColumnModel ID="ColumnModel1" runat="server">
                <ext:Column DataIndex="Type" Width="16">
                    <Renderer Fn="companyRenderer"/>
                <ext:Column Header="Cust" DataIndex="Customer"/>
    Last edited by Daniil; May 04, 2011 at 5:59 AM. Reason: [CLOSED]
  2. #2

    '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;
    Vladimir Shcheglov
    Sr. Developer
  3. #3
    Aha, i see! I used the code you posted here:

    and you wrote

    var companyRenderer = function (value, record) {
    thus the misunderstanding =)
  4. #4

    Yes, it was my mistake, Daniil corrected me in the next post
    Vladimir Shcheglov
    Sr. Developer
  5. #5
    Ah, ok =)

    Thanks for the quick answer as always!

Similar Threads

  1. Replies: 1
    Last Post: Jun 26, 2012, 11:29 AM
  2. Replies: 4
    Last Post: Oct 11, 2011, 2:42 AM
  3. [CLOSED] Cannot read property "childNodes" of undefined
    By jlosi in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Jun 02, 2011, 6:07 PM
  4. Replies: 4
    Last Post: Apr 29, 2011, 6:49 PM
  5. Replies: 14
    Last Post: Apr 12, 2011, 2:49 PM

Posting Permissions