Results 1 to 6 of 6

Thread: ComboBox with images

  1. #1

    Default ComboBox with images

    Hi Im trying to make ComboBox that allows user to select image. I can display drop-down list of images using Template but can't find info on how to show image in Edit box itself. In other words when I select image from expanded state I'd like for that image to be displayed instead of the text. Is there way? Here is my code:
    Code:
                var thumbTemplate = new Ext.Template(
                    '<div class="thumb-wrap" id="{id}"><img src="/images/spacer.gif" border=1 width=18 height=18 class="{html}"></div>'
                );
                this._cbox = new Ext.form.ComboBox({
                        displayField:'html',
                        mode: 'local',
                        triggerAction: 'all',
                        selectOnFocus:true,
                        editable:false,
                        listWidth:30,
                        tpl: thumbTemplate,
                        store:new Ext.data.SimpleStore({
                                fields:['id','html'],
                                data:[
                                    ['truck','dlg-vehicle-truck'],
                                    ['car','dlg-vehicle-car']
                                ]
                        })
                    });

  2. #2
    Sencha User
    Join Date
    Apr 2007
    Location
    Ireland
    Posts
    1,750

  3. #3

    Default

    I certainly didn't . Thanks for the help

  4. #4

    Default

    2fay
    Hm, I've done all, like in tutorial you provided,
    but mine combobox is not expandable
    I can see only one item, but cannot expand and select another one, only through javascript
    combo.setValue(value).
    Can you help? Please.
    Thank you.

  5. #5

    Default

    Quote Originally Posted by vasmann View Post
    2fay
    Hm, I've done all, like in tutorial you provided,
    but mine combobox is not expandable
    I can see only one item, but cannot expand and select another one, only through javascript
    combo.setValue(value).
    Can you help? Please.
    Thank you.

    aha, I've found the problem
    In Ext.ux.IconCombo.js
    when you set template (tpl), there should be:
    this.tpl = config.tpl ||
    '<tpl for=".">'
    + '<div class="x-combo-list-item x-icon-combo-item {'
    + this.iconClsField
    + '}">{'
    + this.displayField
    + '}</div>'
    + '</tpl>'

    instead of
    this.tpl = config.tpl ||
    '<div class="x-combo-list-item x-icon-combo-item {'
    + this.iconClsField
    + '}">{'
    + this.displayField
    + '}</div>'

  6. #6

    Default

    Great find vasman! I'm going to mention your fix to the author of the tuorial.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •