[CLOSED] Combo list adjust

  1. #1

    [CLOSED] Combo list adjust

    Related to this thread: http://forums.ext.net/showthread.php...own-a-combobox

    I've this piece of code
    var newWidth = Math.max(Math.max(combo.triggerWrap.getWidth(), combo.minListWidth), maxTextWidth + 30);
    
            if (newWidth != combo.listWidth) {
                combo.listWidth = newWidth;
                combo.list.setSize(combo.listWidth, 0);
                combo.innerList.setWidth(combo.listWidth - combo.list.getFrameWidth('lr'));
            }
    But in v2; combo.listWidth, combo.list and combo.innerList doesn't exists. I'm using this code inside a combo plugin in expand event.

    This is code plugin (the other piece of code is in the bottom 'expandEvent' function):
    Ext.namespace('Ext.ux.netbox');
    
    Ext.ux.netbox.ExtendedCombo = function (config) {
        this.onDeletePress = config.onDeletePress;
        this.onBackSpacePress = config.onBackSpacePress;
    };
    
    Ext.ux.netbox.ExtendedCombo.prototype = {
    
        init: function (field) {
            this.field = field;
    
            this.field.on('specialKey', this.onSpecialKey, this);
    
            if (this.field.rendered)
                this.initializeControl();
            else
                this.field.on('render', this.initializeControl, this);
        },
    
        initializeControl: function () {
    
            //FIX:Evitamos ataque XSS
            this.field.tpl = '<tpl for="."><div class="x-combo-list-item">{' + this.field.displayField + ':htmlEncode}</div></tpl>';
    
            this.field.getEl().on('keypress', this.processKeyPress, this);
            this.field.on('beforeselect', this.beforeSelectEvent, this);
            this.field.on('expand', this.expandEvent, this);
            this.field.on('blur', this.blurEvent, this);
    
            //Valores obligatorios
            this.field.editable = true;
            this.field.enableKeyEvents = true;
            this.field.typeAhead = true;
            this.field.disableKeyFilter = true;
            this.field.forceSelection = true;
            this.field.mode = 'local';
            this.field.minChars = 0;
        },
    
        onSpecialKey: function (field, e) {
            if (e.getKey() == e.DELETE) {
                var oldValue = this.field.getValue();
                if (this.field.allowBlank) {
                    this.field.clearValue();
                }
                else {
                    this.field.reset();
                }
    
                if (!Ext.isEmpty(this.onDeletePress))
                    eval(this.onDeletePress)(this.field, e, oldValue);
            }
        },
    
        processKeyPress: function (e) {
            if (e.getKey() == e.BACKSPACE && Ext.isEmpty(this.field.getText())) {
                this.field.clearValue();
    
                if (!Ext.isEmpty(this.onBackSpacePress))
                    eval(this.onBackSpacePress)(e);
            }
        },
    
        beforeSelectEvent: function (item, record, index) {
            item.previousValue = item.value;
        },
    
        blurEvent: function (combo) {
            if (combo.getStore().findExact(combo.valueField, combo.getValue()) == -1) {
                if (!Ext.isEmpty(combo.oldText))
                    combo.getEl().setValue(combo.oldText);
            }
        },
    
        expandEvent: function (combo) {
            var store = combo.getStore();
    
            if (!Ext.isEmpty(store)) {
                var field = combo.displayField;
                var maxTextWidth = 0;
    
                Ext.each(store.data.items, function (record) {
                    var text = eval('record.data.' + field);
                    var size = Ext.util.TextMetrics.measure(combo.getEl().dom, text);
    
                    if (size.width > maxTextWidth)
                        maxTextWidth = size.width;
                });
            }
    
            var newWidth = Math.max(Math.max(combo.triggerWrap.getWidth(), combo.minListWidth), maxTextWidth + 30);
    
            if (newWidth != combo.listWidth) {
                combo.listWidth = newWidth;
                combo.list.setSize(combo.listWidth, 0);
                combo.innerList.setWidth(combo.listWidth - combo.list.getFrameWidth('lr'));
            }
       }
    };
    
    Ext.ux.ExtendedCombo = Ext.ux.netbox.ExtendedCombo;
    What can I use now to access internal list of the combo?
    Last edited by Daniil; Jun 15, 2012 at 2:11 PM. Reason: [CLOSED]
  2. #2
    Hi,

    Please use
    comboBox.getPicker()
    It's an Ext.Element which represents the ComboBox list.

    Example
    comboBox.getPicker().setWidth(200)
    See also
    http://docs.sencha.com/ext-js/4-1/#!...cfg-listConfig
    http://docs.sencha.com/ext-js/4-1/#!...thod-getPicker
  3. #3
    Thanks it solved my problem

Similar Threads

  1. Replies: 8
    Last Post: Nov 28, 2011, 9:25 AM
  2. [CLOSED] Combox Editor- Dynamic Combo box list Value
    By vali1993 in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Aug 22, 2010, 8:02 PM
  3. [CLOSED] Combo box list alignment
    By yobnet in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: May 10, 2010, 6:14 AM
  4. Replies: 5
    Last Post: Dec 18, 2009, 9:50 AM
  5. Inconsistent height on div.x-combo-list-inner
    By dlouwers in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Jan 14, 2009, 3:17 PM

Tags for this Thread

Posting Permissions