Results 1 to 7 of 7

Thread: Inconsistent behavior in column config?

  1. #1
    Sencha Premium Member
    Join Date
    May 2012
    Posts
    88
    Vote Rating
    5
      0  

    Default Inconsistent behavior in column config?

    I just noticed that if I define a column with defaults and assign it a renderer plus a style the style is applied to just the header, but the cell renderer is applied to each cell.

    Is this expected behavior?

    Here is my code:

    Code:
    Ext.create('Ext.data.Store', {
        storeId : 'simpsonsStore',
        fields  : ['name', 'email'],
        data    : {
            'items' : [
                {
                    'name'  : 'Lisa',
                    "email" : "lisa@simpsons.com"},
                {
                    'name'  : 'Bart',
                    "email" : "bart@simpsons.com"},
                {
                    'name'  : 'Homer',
                    "email" : "home@simpsons.com"},
                {
                    'name'  : 'Marge',
                    "email" : "marge@simpsons.com"}
            ]
        },
        proxy   : {
            type   : 'memory',
            reader : {
                type : 'json',
                root : 'items'
            }
        }
    });
    
    Ext.create('Ext.grid.Panel', {
        title    : 'Simpsons',
        store    : Ext.data.StoreManager.lookup('simpsonsStore'),
        columns  : {
            defaults : {
                flex     : 1,
                style    : {
    // why is this only effecting the header?
                    'font-weight' : 'bold',
                    'color'       : 'red'
                },
                renderer : function (val) {
                    return '<span style="color:blue;">' + val + '</span>';
                }
            },
            items    : [
                {
                    header    : 'Name',
                    dataIndex : 'name'},
                {
                    header    : 'Email',
                    dataIndex : 'email'}
            ]
        },
        height   : 200,
        width    : 400,
        renderTo : Ext.getBody()
    });?
    And a demo on JSFiddle, http://jsfiddle.net/JamesFM/S37ud/ Note that while JSFiddle is using 4.0.7, I see the behavior on 4.1.0 as well.

    EDIT: I have since corrected the JSFiddle to use 4.1.0.

  2. #2
    Sencha Premium Member
    Join Date
    May 2012
    Posts
    88
    Vote Rating
    5
      0  

    Default

    Did I put this thread in the wrong place?

  3. #3
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,556
    Vote Rating
    1272
      0  

    Default

    Did you try specifying the renderer on the actual column items?
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  4. #4
    Sencha Premium Member
    Join Date
    May 2012
    Posts
    88
    Vote Rating
    5
      0  

    Default

    Yup. That behaves exactly the same as far as I can tell.

    You would expect it to right?

  5. #5
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,556
    Vote Rating
    1272
      0  

    Default

    I have never had this issue. What is rendered on screen always is what the renderer returns.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  6. #6
    Sencha Premium Member
    Join Date
    May 2012
    Posts
    88
    Vote Rating
    5
      0  

    Default

    It's not that the renderer doesn't work, it's that the behavior for the style object and renderer function is inconsistent.

    The style only gets applied to the header, and the renderer only effects the rows. Take a look at http://jsfiddle.net/JamesFM/S37ud/ for an illustration of it in action.

    This might be a bug, I just wanted to make sure I wasn't misunderstanding how this was suppose to behave.

  7. #7
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,556
    Vote Rating
    1272
      0  

    Default

    Oh I see, to be honest the style config should be deprecated as styling an app should all be done with CSS files.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •