1. #11
    Sencha User
    Join Date
    Feb 2012
    Posts
    2
    Vote Rating
    0
    hzmt is on a distinguished road

      0  

    Default


    The current issue I'm having is that the animated toggle component I'm adding skips animation when I toggle from 'yes' to 'no' because after the store value is updated it redraws the component.

    Additionally, if I have autosync enabled on the store all the components in the grid will redraw when a toggle is.. toggled. I worked around that issue by disabling autosync.. overloading the component's onClick method and then passing the record and dataIndex into the component, then saving the record in the overloaded method instead. This also fixed the issues I was having with grids that had row editors on them.

  2. #12
    Sencha Premium Member
    Join Date
    May 2007
    Location
    USA
    Posts
    73
    Vote Rating
    0
    notjoshing is on a distinguished road

      0  

    Default getting back to the record?

    getting back to the record?


    I really like this component; thank you for coding this. I've been using it in a tool in which I need to be able to get back to the record from the rendered component, in this case a date field. Any thoughts on how to get back to the grid's record and column from the component?

    Josh
    Using:
    ExtJS 2.2, 3.2, 4.0.7a
    WinXP SP3
    FF10,6; IE6; IE8; Safari

  3. #13
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,596
    Vote Rating
    324
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default


    The easiest way is probably just to capture the record in the closure of whatever handler function you've written. Here's an example using a button:

    Code:
    {
        ...
        dataIndex: 'active',
        xtype: 'componentcolumn',
        renderer: function(value, meta, record) {
            return {
                text: value ? 'Disable' : 'Enable',
                xtype: 'button',
                handler: function() {
                    record.set('active', !value);
                }
            };
        }
    }
    If you can't use a closure (perhaps because the function is declared elsewhere like it would be in the MVC) then you could just save the record as a property on the component and grab it when you need it.

  4. #14
    Sencha Premium Member
    Join Date
    May 2007
    Location
    USA
    Posts
    73
    Vote Rating
    0
    notjoshing is on a distinguished road

      0  

    Default


    Nice approach. I've tried it out and it works.

    Thanks!
    Using:
    ExtJS 2.2, 3.2, 4.0.7a
    WinXP SP3
    FF10,6; IE6; IE8; Safari

  5. #15
    Sencha - Community Support Team mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    2,751
    Vote Rating
    106
    mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all

      0  

    Default


    Nice work! Thought: Isn't it too late to try to clean up _after_ the dom elements have all been wiped?

    Code:
     me.mon(view, 'refresh', me.onViewChange, me);
            me.mon(view, 'itemupdate', me.onViewChange, me);
    Perhaps intercepting the grid views 'refresh' method and bufferRender (or whatever it's called for single item redraw) to clean up before the dom elements are gone could be a safer bet?

  6. #16
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,596
    Vote Rating
    324
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default


    I'm not sure I follow. Why might it be too late to destroy a component after its el is removed from the DOM? The tests I've done suggest that the components do get cleaned up using this approach. Is there a potential leak I'm missing doing things this way?

  7. #17
    Sencha - Community Support Team mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    2,751
    Vote Rating
    106
    mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all

      0  

    Default


    Seems I misunderstood how the browser GC worked, I ran some tests in sIEve and couldn't find anything odd. Disregard my ramblings

  8. #18
    Ext JS Premium Member
    Join Date
    Jun 2011
    Posts
    110
    Vote Rating
    0
    Jeff Liotta is on a distinguished road

      0  

    Default


    My original support request thread is at
    http://www.sencha.com/forum/showthread.php?192591-Using-Ext-widgets-in-Grid-cells&p=773529#post773529

    I am now able to render Ext widgets in grid cells using Skirtle's plugin, thanks!!
    I am facing another problem now wherein findField is not able to find these Ext widgets embedded in grid cells?

    Do you know if findField is only for form panels and NOT for grid panels? Or is this a limitation of plugin or bug or something else?

    I have a main form panel (id:framework), which has another form panel (blocks container) as one of its items.
    This blocks container has multiple sub blocks which are rendered in individual form panels themselves.
    For one of special block types, I used grid panel instead of form panel and this grid panel has Ext widgets rendered using Skirtle's plugin.
    Name-based findField works for other fields which are part of form panel but not for grid panel field.

    I have to do findField at multiple places and may not always know which block row or block I am working and hence want to do search using top level form.

    Please advice.

  9. #19
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,596
    Vote Rating
    324
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default


    The fields rendered by Component column are just injected into the DOM, they aren't part of the component hierarchy. While it may look like they are children of the grid they actually aren't.

    findField uses ComponentQuery behind the scenes. That walks the component hierarchy looking for suitable components.

    From a quick look at how ComponentQuery is implemented, it looks like all you'd need to do is override getRefItems to return your fields. It gets a little tricky if your grid is refreshed as you'll need to make sure only the current items are returned.

    I'll take a look to see if this is something that could feasibly be implemented in a future version but I'm not yet sure if it could be made to work in the general case.

  10. #20
    Ext JS Premium Member
    Join Date
    Jun 2011
    Posts
    110
    Vote Rating
    0
    Jeff Liotta is on a distinguished road

      0  

    Default


    If it not much of pain, could you please provide some sample code/class that I can use/test as starting point and let you know how it goes.
    I don't have grid refresh use case currently, so I believe you are suggesting to override Ext.ComponentQuery.
    But I don't see getRefItems() method in Ext.ComponentQuery but found it in Ext.form.FieldSet.


    I am new to Ext JS and not overriden any Ext Core classes, so I may not be getting this.
    Also Ext.ComponentQuery is singleton if that matters.