1. #1
    Ext User
    Join Date
    Jan 2009
    Posts
    1
    Vote Rating
    0
    kohalza is on a distinguished road

      0  

    Question How do I create a a simple list of links?

    How do I create a a simple list of links?


    This is probably a newbie question.

    I want to create a simple list of links inside a border layout.
    I don't want a Tree, and the Menu object doesn't seem to be the answer either.
    Is there a way do to this with ext?

    The only other solution I can think of is to have the list of links in already in the DOM and assign it as the HTML of the layout, but I would rather have a way to create the list with ext.

    Any help would be appreciated.

  2. #2
    jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,353
    Vote Rating
    79
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    you can use an XTemplate (there are numerous examples and the API docs are online)

  3. #3
    Ext User
    Join Date
    Jul 2007
    Location
    Florida
    Posts
    9,996
    Vote Rating
    5
    mjlecomte will become famous soon enough mjlecomte will become famous soon enough

      0  

    Default


    http://examples.extjs.eu/?ex=compcomm

    or if you want to use existing element of html, look at the simple tasks demo.

  4. #4

  5. #5
    Sencha User
    Join Date
    Jun 2012
    Posts
    82
    Vote Rating
    1
    dr-dan is on a distinguished road

      0  

    Default


    Some code might be useful to someone one day:

    Code:
    Ext.define('MyApp.view.FooterPanel', {
      extend: 'Ext.container.Container',
      id: 'footerPanel',
      links: Ext.create('Ext.data.Store', {
        fields: ['text', 'href'],
        data: [
            { "text": "Français", href: '/Locale/fr-FR' },
            { "text": _localise("About"), href: '' },
            { "text": _localise("Careers"), href: '' },
            { "text": _localise("Privacy"), href: '' },
            { "text": _localise("Terms"), href: '' },
            { "text": _localise("Help"), href: '' }
        ]
      }),
      listeners: {
        afterrender: {
          fn: function (cmp) {
            cmp.update( new Ext.XTemplate(
              '<ul><li>Acme Inc &copy; 2012</li>',
              '<tpl for=".">',
                  '<li class="dot">•</li><li><a href="{data.href}">{data.text}</li>',
              '</tpl>',
              '</ul>'
            ).applyTemplate(cmp.links));
          }
        }
      }
    })