Hybrid View

    Success! Looks like we've fixed this one. According to our records the fix was applied for a bug in our system in a recent build.
  1. #1
    Sencha User
    Join Date
    Jan 2012
    Posts
    21
    Vote Rating
    0
    robferguson is on a distinguished road

      0  

    Default FieldSet layout (re-size) bug

    FieldSet layout (re-size) bug


    Hi,

    Following on from this post:

    http://www.sencha.com/forum/showthre...nd-row-spacers

    I have a form that occupies the center panel of a BorderLayoutContainer. The form will size / re-size correctly without Ext GWT FieldSet's. However, once I add the Ext GWT FieldSet's to the form it no longer resize's correctly.

    However, it works as expected when using "<filedset>":

    Code:
      private native String getAddressInformationSectionTableMarkup() /*-{
        return [ '<fieldset>',
            '<legend>Address Information:</legend>',
            '<table width=100% cellpadding=0 cellspacing=0>',
            '<tr><td class=addressName width=50%></td><td class=postalCode width=50%></td></tr>',
            '<tr><td class=addressLine1></td><td class=country></td></tr>',
            '<tr><td class=addressLine2></td><td class=addressType></td></tr>',
            '<tr><td class=addressLine3></td><td></td></tr>',
            '<tr><td class=city></td><td></td></tr>',
            '<tr><td class=state></td><td></td></tr>',
            '</table>',
            '</fieldset>'
        ].join("");
      }-*/;
    Cheers
    Rob

    Code:
    public class ContactInformationView extends AbstractFormView<ContactInformationUiHandlers> implements
        ContactInformationPresenter.MyView {
    
      protected TabPanel tabPanel;
    
      protected VerticalLayoutContainer vLayout;
    
      protected FieldSet generalInformation;
      protected FieldSet addressInformation;
    
      protected HtmlLayoutContainer generalLayout;
      protected HtmlLayoutContainer addressLayout;
    
      @Inject
      public ContactInformationView(final EventBus eventBus, final TabPanel tabPanel) {
        super(eventBus);
    
        Log.debug("ContactInformationView()");
    
        this.tabPanel = tabPanel;
    
        getTabPanel().setWidth(CONTEXT_AREA_WIDTH);
        getForm().setWidget(getTabPanel());
    
        createGeneralInformationSection();
    
        createAddressInformationSection();
    
        vLayout = new VerticalLayoutContainer();
        vLayout.setLayoutData(new MarginData(DEFAULT_MARGIN));
    
        // vLayout.add(generalInformation, new VerticalLayoutData(1, -1));
        // vLayout.add(addressInformation, new VerticalLayoutData(1, -1));
    
        vLayout.add(generalLayout, new VerticalLayoutData(1, -1));
        vLayout.add(addressLayout, new VerticalLayoutData(1, -1));
    
        getTabPanel().add(vLayout, "General");
    
        // /*
    
        this.panel.addResizeHandler(new ResizeHandler() {
          @Override
          public void onResize(ResizeEvent event) {
    
            int width = event.getWidth();
            int height = event.getHeight();
    
            Log.debug("vLayout - width: " + width + " height: " + height);
    
            vLayout.setSize(width + "px", height + "px");
            // generalInformation.setWidth((width - DEFAULT_MARGIN * 5) + "px");
            // addressInformation.setWidth((width - DEFAULT_MARGIN * 5) + "px");
            // generalInformation.forceLayout();
            // addressInformation.forceLayout();
          }
        });
    
        // */
      }
    
      protected void createGeneralInformationSection() {
    
        generalInformation = new FieldSet();
        generalInformation.setHeadingText("General Information");
        generalInformation.setCollapsible(true);
    
        generalLayout = new HtmlLayoutContainer(getGeneralInformationSectionTableMarkup());
        generalLayout.setLayoutData(new MarginData(DEFAULT_MARGIN));
    
        new ContactInformationNameSection(generalLayout);
        new ContactInformationElectronicAddressSection(generalLayout);
    
        // generalInformation.add(generalLayout);
      }
    
      protected void createAddressInformationSection() {
    
        addressInformation = new FieldSet();
        addressInformation.setHeadingText("Address Information");
        addressInformation.setCollapsible(true);
    
        addressLayout = new HtmlLayoutContainer(getAddressInformationSectionTableMarkup());
        addressLayout.setLayoutData(new MarginData(DEFAULT_MARGIN));
    
        new ContactInformationAddressSection(addressLayout);
    
        // addressInformation.add(addressLayout);
      }
    
      private native String getGeneralInformationSectionTableMarkup() /*-{
        return [ '<table width=100% cellpadding=0 cellspacing=0>',
            '<tr><td class=salutation width=50%></td><td class=businessPhone width=50%></td></tr>',
            '<tr><td class=givenName></td><td class=homePhone></td></tr>',
            '<tr><td class=middleName></td><td class=mobilePhone></td></tr>',
            '<tr><td class=familyName></td><td class=fax></td></tr>', '</table>'
        ].join("");
      }-*/;
    
      private native String getAddressInformationSectionTableMarkup() /*-{
        return [ '<fieldset>',
            '<legend>Address Information:</legend>',
            '<table width=100% cellpadding=0 cellspacing=0>',
            '<tr><td class=addressName width=50%></td><td class=postalCode width=50%></td></tr>',
            '<tr><td class=addressLine1></td><td class=country></td></tr>',
            '<tr><td class=addressLine2></td><td class=addressType></td></tr>',
            '<tr><td class=addressLine3></td><td></td></tr>',
            '<tr><td class=city></td><td></td></tr>',
            '<tr><td class=state></td><td></td></tr>',
            '</table>',
            '</fieldset>'
        ].join("");
      }-*/;
    Attached Images

  2. #2
    Ext GWT Premium Member
    Join Date
    Aug 2010
    Location
    Germany, Solingen
    Posts
    239
    Vote Rating
    2
    gishmo is on a distinguished road

      0  

    Default


    Can confirm this problem.

  3. #3
    Software Architect
    Join Date
    Sep 2007
    Posts
    13,971
    Vote Rating
    132
    sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light

      0  

    Default


    I cannot follow that code. You commented out all uses of the GXT fieldset in that code.

    Can you please provide all fully working testcase implementing EntryPoint that shows this?

    http://www.sencha.com/examples-dev/#...e:formsexample uses a fieldset and the children are resized.

  4. #4
    Ext GWT Premium Member
    Join Date
    Aug 2010
    Location
    Germany, Solingen
    Posts
    239
    Vote Rating
    2
    gishmo is on a distinguished road

      0  

    Default


    Hi Sven,
    will try to create a sample project.
    May be it is because it is inside a TabPanel.
    Frank

  5. #5
    Sencha User
    Join Date
    Jan 2012
    Posts
    21
    Vote Rating
    0
    robferguson is on a distinguished road

      0  

    Default


    Hi,

    -> I cannot follow that code. You commented out all uses of the GXT fieldset in that code.

    Ok, its a View implementation built using GWTP. I tried various options to try and locate the problem - that's why the FieldSet code is commented out.

    I have a form that occupies the center panel of a BorderLayoutContainer. The form will size / re-size correctly without Ext GWT FieldSet's. However, once I add the Ext GWT FieldSet's to the form it no longer resize's correctly.

    However, it works as expected (re-sizes correctly) when using "<fieldset>":

    - Can you please provide all fully working testcase implementing EntryPoint that shows this?

    The source for the sample is here:

    -> http://code.google.com/p/gwt-cx/source/checkout

    -> http://code.google.com/p/gwt-cx/sour...state%3Dclosed

    Take a look at the ContactInformationView and the ContactInformationAddressSection and the ContactInformationAddressSection.

    - http://www.sencha.com/examples-dev/#...e:formsexample uses a fieldset and the children are resized.

    Yes, however the sample uses a VerticalLayoutContainer and not a HtmlLayoutContainer (I have a multi-column form) and the form in the sample does not re-size. Its a re-sizing bug.

    Note: There's a demo of a Smart GWT version of a similar (double-click on Accounts) form here:

    -> http://gwt-cx.com/serendipity/Serendipity.html

    I haven't completed the Ext GWT demo.

    Cheers
    Rob

  6. #6
    Software Architect
    Join Date
    Sep 2007
    Posts
    13,971
    Vote Rating
    132
    sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light

      0  

    Default


    HtmlLayoutContainer does not resize its children. This means you need to resize them manually, like the FieldSet widget you put into the there.

    I do not see any bug here.

  7. #7
    Sencha - GXT Dev Team darrellmeyer's Avatar
    Join Date
    May 2007
    Location
    Washington, DC
    Posts
    2,242
    Vote Rating
    2
    darrellmeyer is on a distinguished road

      0  

    Default


    Fixed in SVN (rev 2331)

  8. #8
    Sencha User WesleyMoy's Avatar
    Join Date
    Oct 2009
    Location
    Redwood City, California
    Posts
    402
    Vote Rating
    2
    WesleyMoy is on a distinguished road

      0  

    Default


    This bug has been fixed in the Ext GWT 3.0 Release Candidate. Please upgrade your copy of Ext GWT and try your test case again. While we're confident that we've addressed this issue, please reply if you notice any continued problems after upgrading. Again, thanks for taking the time to report this bug.

  9. #9
    Ext GWT Premium Member
    Join Date
    Oct 2008
    Posts
    72
    Vote Rating
    5
    elirov is on a distinguished road

      0  

    Default


    I'm still having a problem with FieldSet in both Chrome and Firefox. Here's the code:
    Code:
          FieldSet fs = new FieldSet();      fs.setHeadingText("Test");
          fs.add(new TextArea(), new MarginData(10));
          com.sencha.gxt.widget.core.client.Window w = new com.sencha.gxt.widget.core.client.Window();
          w.add(fs);
          w.setPixelSize(400, 400);
          w.show();
    The text area should take up the entire fieldset size, but it takes up only two lines on top. Same thing happens when I add a button instead of a text area. It almost looks like it's adding a child and allowing the child to choose its own height instead of sizing the child to take up all the available space, like a SimpleContainer would do.

    fieldset_bug.jpg

    Thanks!

  10. #10
    Ext GWT Premium Member
    Join Date
    Oct 2008
    Posts
    72
    Vote Rating
    5
    elirov is on a distinguished road

      0  

    Default


    Is it possible that we're missing the following in the onResize() method in FieldSet?
    Code:
    getContainerTarget().setHeight(height - getElement().getFrameWidth(Side.TOP, Side.BOTTOM));
    Is there a reason to only set the width and not the height of the container target?