1. #1
    Ext JS Premium Member christocracy's Avatar
    Join Date
    Oct 2006
    Location
    Montreal
    Posts
    381
    Vote Rating
    0
    christocracy is on a distinguished road

      0  

    Default [2.0b1][DUP][CLOSED] ComboBox listWidth not matching ComboBox width

    [2.0b1][DUP][CLOSED] ComboBox listWidth not matching ComboBox width


    On a tabbed-form, after setting "deferredRender: false", my ComboBox listWidths are all stuck at 68px. to solve this, I'm forced to explicitly define both ComboBox width and listWidth.

    1. with deferredRender: false (listWidth is incorrect -- not wide enough)
    list html:
    Code:
    <div class="x-layer x-combo-list" id="ext-gen652" style="position: absolute; z-index: 11000; visibility: visible; left: 450px; top: 149px; width: 68px; height: 21px;"><div class="x-combo-list-inner" id="ext-gen654" style="width: 68px; height: auto;"><div class="x-combo-list-item x-combo-selected">consignee one</div></div></div>
    combobox html (*note field wrap has width: 0px):
    Code:
    <div style="padding-left: 80px;" id="x-form-el-ext-comp-1035" class="x-form-element"><div class="x-form-field-wrap x-trigger-wrap-focus" id="ext-gen228" style="width: 0px;"><input type="hidden" id="shipper[account_id]" name="shipper[account_id]" value=""/><input type="text" id="ext-comp-1035" autocomplete="off" size="24" class="x-form-text x-form-field x-form-invalid x-form-focus" tabindex="1"/><img class="x-form-trigger x-form-arrow-trigger" src="javascripts/ext-2.0/resources/images/default/s.gif" id="ext-gen229"/><a style="margin-left: 20px;" href="#" id="ext-gen234">add</a></div></div>
    2. with deferredRender: true (listWidth is correct -- same width as ComboBox)
    list html:
    Code:
    <div class="x-layer x-combo-list" id="ext-gen493" style="position: absolute; z-index: 11000; visibility: visible; left: 450px; top: 126px; width: 180px; height: 21px;"><div class="x-combo-list-inner" id="ext-gen495" style="width: 180px; height: auto;"><div class="x-combo-list-item x-combo-selected">asdfasf asdfasdf</div></div></div>
    combobox html (*note field-wrap has width: 182px):
    Code:
    <div style="padding-left: 80px;" id="x-form-el-ext-comp-1035" class="x-form-element"><div class="x-form-field-wrap" id="ext-gen225" style="width: 182px;"><input type="hidden" id="shipper[account_id]" name="shipper[account_id]" value=""/><input type="text" id="ext-comp-1035" autocomplete="off" size="24" class="x-form-text x-form-field x-form-invalid" tabindex="1"/><img class="x-form-trigger x-form-arrow-trigger" src="javascripts/ext-2.0/resources/images/default/s.gif" id="ext-gen226"/><a style="margin-left: 20px;" href="#" id="ext-gen231">add</a></div></div>
    combo.js (Ext.form.ComboBox::initList)
    Code:
    initList : function(){
            if(!this.list){
                var cls = 'x-combo-list';
    
                this.list = new Ext.Layer({
                    shadow: this.shadow, cls: [cls, this.listClass].join(' '), constrain:false
                });
                
                //////////////////////////////////////////////////////////////////////////////////////
                // Chris says:  with deferredRender: false, this.wrap.getWidth() is returning 0, 
                // therefore minListWidth is being used??
                //
    
                var lw = this.listWidth || Math.max(this.wrap.getWidth(), this.minListWidth);
                this.list.setWidth(lw);
    -->

  2. #2
    Sencha - Community Support Team jsakalos's Avatar
    Join Date
    Apr 2007
    Location
    Slovakia
    Posts
    27,538
    Vote Rating
    380
    jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future

      0  

    Default


    Thank you for posting. We will take a look at it.
    Jozef Sakalos, aka Saki

    Education, extensions and services for developers at new http://extjs.eu
    News: Grid Search Plugin, ExtJS 5 Complex Data Binding using MVVM

    -->

  3. #3
    Sencha User jack.slocum's Avatar
    Join Date
    Mar 2007
    Location
    Tampa, FL
    Posts
    6,955
    Vote Rating
    17
    jack.slocum will become famous soon enough jack.slocum will become famous soon enough

      0  

    Default


    This is a duplicate. More information as to the cause was posted in the other thread.
    Jack Slocum
    Ext JS Founder
    Original author of Ext JS 1, 2 & 3.
    Twitter: @jackslocum
    jack@extjs.com
    -->

Thread Participants: 2