1. #1
    Sencha User
    Join Date
    Oct 2011
    Posts
    33
    Vote Rating
    0
    ps_arunkumar is on a distinguished road

      0  

    Question Unanswered: how add dynamic button in grid panel column using renderer?

    Unanswered: how add dynamic button in grid panel column using renderer?


    hi,

    i am using extjs 4.0.2a.
    i find this example on net http://www.rahulsingla.com/sites/def...-GridPanel.htm

    i try this one in extjs 4.0.2a but not work.

    show this error in firebug
    function () {var btn = new (Ext.Button)({renderTo: id, text: "Price: " + value});}.defer is not a function
    [Break On This Error] }).defer(25);

    i need button grid panel column and click that button show window(passing parameter to render grid inside window).

    is it possible to do this?




  2. #2
    Sencha User
    Join Date
    May 2010
    Location
    Kiev, Ukraine
    Posts
    135
    Vote Rating
    7
    Answers
    14
    khmurach is on a distinguished road

      0  

    Default


    Code:
    renderer: function (v, m, r) {
        var id = Ext.id();
        Ext.defer(function () {
            Ext.widget('button', {
                renderTo: id,
                text: 'Edit: ' + r.get('name'),
                width: 75,
                handler: function () { Ext.Msg.alert('Info', r.get('name')) }
            });
        }, 50);
        return Ext.String.format('<div id="{0}"></div>', id);
    }
    Demo here http://ext4all.com/post/how-add-dyna...using-renderer

  3. #3
    Sencha User
    Join Date
    Oct 2011
    Posts
    33
    Vote Rating
    0
    ps_arunkumar is on a distinguished road

      0  

    Default Thanks

    Thanks


    Hi khmurach,

    Thanks for your Reply. Its helpful to me.

  4. #4
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,508
    Vote Rating
    57
    Answers
    13
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Bad idea. It will leave orphaned Button instances all over the place.

    Use an ActionColumn

  5. #5
    Sencha Premium Member
    Join Date
    Jun 2012
    Posts
    4
    Vote Rating
    0
    Cristian B. is on a distinguished road

      0  

    Default


    Animal, please supply an example for the ActionCommand that handles exactly as the code above. It seems that it's a often used feature, but a simple example is never to be found.

  6. #6
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,508
    Vote Rating
    57
    Answers
    13
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    The very first grid example, the simplest one has an ActionColumn in it.

  7. #7
    Sencha Premium Member
    Join Date
    Jun 2012
    Posts
    4
    Vote Rating
    0
    Cristian B. is on a distinguished road

      0  

    Default


    Thanks, the example handled adding a actioncomand in two different ways, which was a bit confusing, but I figured it out now.

  8. #8
    Sencha Premium Member
    Join Date
    Apr 2012
    Posts
    12
    Vote Rating
    0
    jason rogers is on a distinguished road

      0  

    Default


    Hi Animal,

    I understand the problems behind
    Code:
    renderer: function (v, m, r) {
        var id = Ext.id();
        Ext.defer(function () {
            Ext.widget('button', {
                renderTo: id, 
               text: 'Edit: ' + r.get('name'), 
               width: 75,
                handler: function () { Ext.Msg.alert('Info', r.get('name')) }
            });
        }, 50);
        return Ext.String.format('<div id="{0}"></div>', id);
     }
    
    And in my case it won't (or at least not in an as straight forwards way as above).

    However I do need to find a way to put a button with icon and text in to the column and it doesn't seem possible with the standard Ext action column.

    What are your suggestions ?