[OPEN] [#842] Custom control/control container height is not calculated correctly in PartialViews

Page 1 of 2 12 LastLast
  1. #1

    [OPEN] [#842] Custom control/control container height is not calculated correctly in PartialViews

    Context:
    Asp.Net MVC4, Ext.Net.MVC 3.2.

    The layout of our application consists of a vbox containing several rows dynamically created witch may contain one or more controls.
    To align correctly those controls we represent every row as a container with an hbox layout.
    Most of our custom controls extend Ext.form.FieldContainer.

    How to reproduce:
    - Controls label alignment is set to “Top”
    - The custom control extends Ext.form.FieldContainer
    - The control is inside a hbox layout (the row in our case)
    - The content is retrieved as a partial view inside the main page

    Sample app:
    https://onedrive.live.com/redir?resi...int=file%2czip

    The issue disappears when resizing the page, but reappears when the container becomes scrollable again.

    We've seen that the following workarounds help to avoid the issue but we cannot apply any of them in our application:
    - Set label alignment to “Right”
    - Using an anchor layout instead of an hbox for the rows and setting the property anchor to “100%” in the inner container of the custom control
    - Removing the hbox layout of the rows
    - Avoid using partial views

    Click image for larger version. 

Name:	ExpectedBehaviour.png 
Views:	61 
Size:	2.2 KB 
ID:	24087Click image for larger version. 

Name:	Problem.png 
Views:	60 
Size:	2.5 KB 
ID:	24088

    We hope in your help to sort this out.
    THANK YOU IN ADVANCE!
    Last edited by Daniil; Jul 28, 2015 at 9:45 AM. Reason: [OPEN] [#842]
  2. #2
    Hi @adrianot,

    I am not 100% sure what is going on, I mean it is an issue or a lack of settings, but I can suggest this:
    <ext:Container runat="server" Height="45">
        <LayoutConfig>
            <ext:HBoxLayoutConfig Align="Stretch" />
        </LayoutConfig>
        <Items>
            <debug:TimerField ID="Timer" runat="server" FieldLabel="Timer" Flex="1" />
        </Items>
    </ext:Container>
  3. #3
    Hi Daniil, thank you for your reply, unfortunately we can't set a fixed height (45) since the content is dynamic, ... it looks like a bug on the layout calculation when the labels are included ... and it looks like only on the FieldContainer (?)

    Thank you
  4. #4
    It appears that rightButtons is a culprit.

    Created an Issue:
    https://github.com/extnet/Ext.NET/issues/842

    Please try this override.

    Fix
    Ext.form.field.Text.override({
        afterRender: function () {
            this.callSuper(arguments);
    
            if (this.iconCls) {
                var iconCls = this.iconCls;
                delete this.iconCls;
                this.setIconCls(iconCls);
            }
    
            if (this.removeClearTrigger) {
                this.inputEl.addCls("x-clear-field");
            }
    
            if (this.removeShowPasswordTrigger) {
                this.inputEl.addCls("x-showpassword-field");
            }
    
            Ext.form.trigger.Trigger.prototype.removeBorderIfSimple.call(this, this);
    
            //this.initButtons();
    
            Ext.defer(function() {
                this.initButtons();
            }, 1, this); 
        }
    });
    Last edited by Daniil; Jul 21, 2015 at 10:54 AM.
  5. #5
    Thank you Daniil for your quick answer, we'll try and let u know as soon as possible!
  6. #6
    Hi Daniil,

    the solution seems to work... BUT it looks like to break when AutoScroll is enabled.

    Without AutoScroll:
    Click image for larger version. 

Name:	NoScroll.png 
Views:	80 
Size:	6.1 KB 
ID:	24096

    With AutoScroll:
    Click image for larger version. 

Name:	AutoScroll.png 
Views:	82 
Size:	4.3 KB 
ID:	24097

    I'm sending you the updated sample project to reproduce:
    https://onedrive.live.com/redir?resi...int=file%2czip

    Thank you in advance, as always,
    Cheers
  7. #7
    I investigated and I think it is an individual issue. It is reproducible regardless rightButtons. As well, it is reproducible with pure ExtJS and this Sencha bug report looks to be the same issue:
    https://www.sencha.com/forum/showthread.php?302189

    I would appreciate if you create a separate forum thread for better tracking. Meanwhile, I already started investigating.
  8. #8
    Hi Daniil, thank you for the update.

    I've posted a new thread here:
    http://forums.ext.net/showthread.php...aligned-labels

    HTH,
    Thanks
  9. #9
    Thank you.

    Meanwhile, I've committed the fix for rightButtons in the revision #6501 (trunk).
  10. #10
    Hi Daniil,
    unfortunately the provided override breaks base controls like ComboBox. (List Items NOT showing on click)
    Sample project attached.

    https://onedrive.live.com/redir?resi...int=file%2czip
Page 1 of 2 12 LastLast

Similar Threads

  1. [CLOSED] Extending Ext.net Control / Creating Custom Control
    By ljankowski in forum 2.x Legacy Premium Help
    Replies: 1
    Last Post: Dec 01, 2014, 6:52 PM
  2. Replies: 2
    Last Post: Jun 19, 2012, 1:19 PM
  3. [CLOSED] Getting error while adding custom control to container
    By AnulekhaK in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Feb 20, 2012, 12:59 PM
  4. Replies: 6
    Last Post: Dec 07, 2011, 12:55 PM
  5. Replies: 4
    Last Post: Feb 23, 2010, 7:38 AM

Tags for this Thread

Posting Permissions