1. #1
    Sencha User
    Join Date
    Dec 2011
    Posts
    9
    Vote Rating
    0
    urig is on a distinguished road

      0  

    Question Newbie: How to bind a store to a list of Ext.button.Buttons

    Newbie: How to bind a store to a list of Ext.button.Buttons


    Hello,

    I would like to bind a store to a vertical list of buttons. By "buttons" I'm referring to full-blown Ext.button.Button (as opposed to HTML "<input type=button>" elements that I build myself.


    How should I go about doing this? I've looked at GridPanel and at DataView and both seem to work with XTemplates. But I cannot see how XTemplates can render Ext.button.Buttons, only text.

    Thanks in advance,
    urig
    Last edited by urig; 18 Jan 2012 at 5:38 AM. Reason: Typo in title

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,073
    Vote Rating
    853
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    So you want to render buttons into an XTemplate?

    I iterate through the records of the store after the dataview has been rendered and populated with the html. I then get the row of that the record is mapped to and then get the element where I want to render the button to. I then use renderTo on the button to render to that element. I also set a property when creating the button to hold the record so you can get the record easily in the button's handler.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Dec 2011
    Posts
    9
    Vote Rating
    0
    urig is on a distinguished road

      0  

    Question Newbie: How to bind a store to a list of Ext.button.Buttons

    Newbie: How to bind a store to a list of Ext.button.Buttons


    Hi Mitchell, Thanks so much for the quick response.

    Rendering Ext Buttons in the XTemplate is a means to an end for me. What I'm hoping for is to simply bind a list of buttons to a list of records in a store.

    I would expect ExtJS to have a ready-made mechanism for this - Like asp.net's Repeater control for example. In the Repeater control, I can embed any other asp.net control and bind it to the data source (store).

    Do I understand correctly that there is no such mechanism in ExtJS and that I will have to iterate over the store myself? Might there be a 3rd party solution that covers this?


    Thanks,
    urig

  4. #4
    Sencha - Community Support Team hendricd's Avatar
    Join Date
    Aug 2007
    Location
    Long Island, NY USA
    Posts
    5,962
    Vote Rating
    10
    hendricd will become famous soon enough hendricd will become famous soon enough

      0  

    Default


    Quote Originally Posted by urig View Post

    I would expect ExtJS to have a ready-made mechanism for this - Like asp.net's Repeater control for example. In the Repeater control, I can embed any other asp.net control and bind it to the data source (store).

    Do I understand correctly that there is no such mechanism in ExtJS and that I will have to iterate over the store myself? Might there be a 3rd party solution that covers this?
    @urig --

    We would 'hope' you will one day see that ExtJS is not constrained by an expensive and bloated serverside experience such as ASP.NET.

    When you get more comfortable with what is possible client-side, you can enhance this further:
    Code:
    var store = yourMysteriousButtonStore,
           defaultHandler = function(button, e) {  },
          buttons = Ext.Array.map(store.getRange(), function(buttonModel) {
                 return {
                      text : buttonModel.get('label'),
                      id    : buttonModel.id,
                      handler : defaultHandler
                 };
           });
    
    anyContainerYouWant.add( buttons);
    
    or 
    
    { xtype : 'toolbar',
       items : buttons
    }
    "be dom-ready..."
    Doug Hendricks

    Maintaining ux: ManagedIFrame, MIF2 (FAQ, Wiki), ux.Media/Flash, AudioEvents, ux.Chart[Fusion,OFC,amChart], ext-basex.js/$JIT, Documentation Site.


    Got Sencha licensing questions? Find out more here.


  5. #5
    Sencha User
    Join Date
    Dec 2011
    Posts
    9
    Vote Rating
    0
    urig is on a distinguished road

      0  

    Default Newbie: How to bind a store to a list of Ext.button.Buttons

    Newbie: How to bind a store to a list of Ext.button.Buttons


    @hendricd Thanks for the suggested solutions. I'm kind of managing with the first idea you gave me.

Thread Participants: 2

Tags for this Thread