1. #1
    Ext User
    Join Date
    Nov 2007
    Posts
    6
    Vote Rating
    0
    hilmi is on a distinguished road

      0  

    Default TextField custom width (inside FormPanel)

    TextField custom width (inside FormPanel)


    Dear All,

    I try to set custom width on one my form component, but could not success with it. May I request a bit help on the this subject?

    Here is, how my code look like:

    @Override
    protected void onRender(Element parent, int pos) {
    super.onRender(parent, pos);
    setButtonAlign(HorizontalAlignment.RIGHT);
    panel = new FormPanel();
    panel.setFrame(false);
    panel.setFieldWidth(310);
    panel.setLabelWidth(80);
    panel.setHeaderVisible(false);
    panel.setStyleAttribute("padding", "0");
    panel.setBodyBorder(false);
    panel.setBorders(false);

    countryName = new TextField();
    countryName.setWidth(45); /* this doesn't work*/
    countryName.setFieldLabel("Country name");
    countryName.setEmptyText("Enter country name");
    countryName.setAllowBlank(false);
    countryName.setAutoValidate(true);
    countryName.setStyleName("framedTxt");
    panel.add(countryName);
    add(panel);
    }

    Thanks in advance!

  2. #2
    Ext GWT Premium Member gslender's Avatar
    Join Date
    Mar 2008
    Location
    Brisbane, Australia
    Posts
    1,572
    Vote Rating
    4
    gslender is on a distinguished road

      0  

    Default


    nope, I don't believe you can set custom widths

  3. #3
    Ext User
    Join Date
    Jul 2008
    Posts
    202
    Vote Rating
    0
    eugenparaschiv is on a distinguished road

      0  

    Default


    You cannot set the width directly, but you can do so by setting the field and label widths on the form itself:
    this.formPanel.setFieldWidth(300);
    this.formPanel.setLabelWidth(200);
    This has the same result as setting the width manually, but of course restricts you from setting individual widths on each field.
    If you want to do that, I bet there is a way to do it with CSS so keep asking.

  4. #4
    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


    You can use FormData to control the width at the field level:

    Code:
        final TextField<String> text = new TextField<String>();
        text.setFieldLabel("Name");
        text.setEmptyText("Enter your full name");
        text.setAllowBlank(false);
        text.setMinLength(4);
        panel.add(text, new FormData(50, -1)); // 50px wide

  5. #5
    Ext User
    Join Date
    Nov 2007
    Posts
    6
    Vote Rating
    0
    hilmi is on a distinguished road

      0  

    Default


    Quote Originally Posted by darrellmeyer View Post
    You can use FormData to control the width at the field level:

    Code:
        final TextField<String> text = new TextField<String>();
        text.setFieldLabel("Name");
        text.setEmptyText("Enter your full name");
        text.setAllowBlank(false);
        text.setMinLength(4);
        panel.add(text, new FormData(50, -1)); // 50px wide
    Thank you!