1. #1
    Sencha User
    Join Date
    Feb 2012
    Posts
    31
    Vote Rating
    0
    waqasaslammmeo is on a distinguished road

      0  

    Default How to add button in Xtemplate in Extjs

    How to add button in Xtemplate in Extjs


    hello teachers !

    i am a newbie in extjs , so please try to help me in very simple way , now here is my prob, i am using xtemplate and i am showing phone no and email ids of my users , now i want to show the edit button with every record , for this , i tried so many times but failed , i can add the html button with <input type="button" value = "Edit">
    but this is not what i want , i want to show the extjs button , how can i do this , is it possible in extjs 3.2 or not , or there is a better way to perform this action .
    please me in this , and if possible then please give me some code to understand it ,

    best Regards ,

    Muhammad Waqas Aslam

  2. #2
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,333
    Vote Rating
    85
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default


    Hi,

    If you want to create an ext button in template first you should wait the rendering process or overwrite process of tpl( means rendering your html elements in the dom ).After that you can create the customized ext components into the rendered html like:
    Code:
           Ext.create({            xtype: 'container'            , renderTo:Ext.getBody()            , tpl: new Ext.XTemplate(                '{Name}',                 '<div class="button"></div>'            )            , data: { Name: 'Aslan' }            , listeners: {                afterrender: function (container) {                    var btn = Ext.get(container.el.query('div.button')[0])                    Ext.create({                        xtype: 'button'                        , renderTo: btn                        , text:'Click Me'                        , listeners: {                            click: function () {                                alert('clicked');                            }                        }                    })                }            }        })
    But this does not seems good, you should try to look at "itemSelector" property of Ext.DataView class (http://docs.sencha.com/ext-js/3-4/#!/api/Ext.DataView).
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

Thread Participants: 1

Tags for this Thread