1. #1
    Ext User
    Join Date
    May 2008
    Posts
    5
    Vote Rating
    0
    bdp11 is on a distinguished road

      0  

    Question FormPanel does not render properly

    FormPanel does not render properly


    hi,

    i tried your example given on your site about Formpanel and i dint get anything on browser then i added formpanel viewport and added viewport to rootpanel and i got the result, but still i dont see Formpanel header, what i mean is that it is transparent .
    other issue is that i tried to add contentPanel to Formpanel and but i dont see anything..
    so if i want to add multiple contentpanel to formpanel , is it possible and if yes then how ?

    Thanks

  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


    post some code (with the whole onModuleLoad) so that we can help... I hate guessing... ;-)

  3. #3
    Ext User
    Join Date
    May 2008
    Posts
    5
    Vote Rating
    0
    bdp11 is on a distinguished road

      0  

    Default code

    code


    sorry about that.. this class is your sample formpanel example on your site. and i just tried add contentpanel to formpanel by changing few things as u can see in code..
    right nwo i have just tried to add single content panel and nothing is coming up..
    but in future i might have to add multiple conten panel to single formpanel

    and if i execute your sample code without any change , i can see formpanel but not header , although i can see header title , also buttons are not visible.


    **************************************

    import java.util.Collections;
    import java.util.Comparator;
    import java.util.List;

    import com.extjs.gxt.samples.resources.client.Stock;
    import com.extjs.gxt.samples.resources.client.TestData;
    import com.extjs.gxt.ui.client.Style.HorizontalAlignment;
    import com.extjs.gxt.ui.client.store.ListStore;
    import com.extjs.gxt.ui.client.widget.Button;
    import com.extjs.gxt.ui.client.widget.LayoutContainer;
    import com.extjs.gxt.ui.client.widget.form.CheckBox;
    import com.extjs.gxt.ui.client.widget.form.CheckBoxGroup;
    import com.extjs.gxt.ui.client.widget.form.ComboBox;
    import com.extjs.gxt.ui.client.widget.form.DateField;
    import com.extjs.gxt.ui.client.widget.form.FormPanel;
    import com.extjs.gxt.ui.client.widget.form.NumberField;
    import com.extjs.gxt.ui.client.widget.form.Radio;
    import com.extjs.gxt.ui.client.widget.form.RadioGroup;
    import com.extjs.gxt.ui.client.widget.form.TextArea;
    import com.extjs.gxt.ui.client.widget.form.TextField;
    import com.extjs.gxt.ui.client.widget.form.TimeField;
    import com.google.gwt.core.client.EntryPoint;
    import com.google.gwt.user.client.Element;
    import com.google.gwt.user.client.ui.RootPanel;
    import com.extjs.gxt.ui.client.widget.ContentPanel;

    public class FormPanelPage extends LayoutContainer implements EntryPoint {

    public void onModuleLoad() {
    RootPanel.get().add(this);
    }

    @Override
    protected void onRender(Element parent, int pos) {
    super.onRender(parent, pos);

    FormPanel fpanel = new FormPanel();
    ContentPanel panel = new ContentPanel();
    panel.setLayout(new FitLayout());
    panel.setFrame(true);
    // panel.setFieldWidth(210);
    // panel.setLabelWidth(100);
    panel.setButtonAlign(HorizontalAlignment.CENTER);
    panel.setHeading("Simple Form");
    panel.setIconStyle("icon-form");
    panel.setWidth(400);
    panel.setStyleAttribute("padding", "20");

    TextField text = new TextField();
    text.setFieldLabel("Name");
    text.setEmptyText("Enter your full name");
    text.setAllowBlank(false);
    text.setMinLength(4);
    panel.add(text);

    NumberField number = new NumberField();
    number.setFieldLabel("Age");
    number.setEmptyText("Enter your age");
    number.setAllowBlank(false);
    panel.add(number);

    text = new TextField();
    text.setFieldLabel("Email");
    panel.add(text);

    DateField date = new DateField();
    date.setFieldLabel("Birthday");
    date.setWidth(210);
    panel.add(date);

    TimeField time = new TimeField();
    time.setFieldLabel("Time");
    time.setWidth(200);
    panel.add(time);

    CheckBox check1 = new CheckBox();
    check1.setBoxLabel("Classical");

    CheckBox check2 = new CheckBox();
    check2.setBoxLabel("Rock");
    check2.setValue(true);

    CheckBox check3 = new CheckBox();
    check3.setFieldLabel("Blue");

    CheckBoxGroup checkGroup = new CheckBoxGroup();
    checkGroup.setFieldLabel("Music");
    checkGroup.add(check1);
    checkGroup.add(check2);
    checkGroup.add(check3);
    panel.add(checkGroup);

    Radio radio = new Radio();
    radio.setName("radio");
    radio.setFieldLabel("Red");
    radio.setValue(true);

    Radio radio2 = new Radio();
    radio2.setName("radio");
    radio2.setFieldLabel("Blue");

    RadioGroup radioGroup = new RadioGroup("test");
    radioGroup.setFieldLabel("Favorite Color");
    radioGroup.add(radio);
    radioGroup.add(radio2);
    panel.add(radioGroup);

    TextArea description = new TextArea();
    description.setPreventScrollbars(true);
    description.setInitialHeight(50);
    description.setFieldLabel("Description");
    panel.add(description);

    panel.addButton(new Button("Save"));
    panel.addButton(new Button("Cancel"));
    fpanel.add(panel);

    add(fpanel);
    }

    }

    **********************

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


    You had a few things wrong, so I've fixed them and this renders ok to me... so compare to your code and this should explain where/what went wrong.

    Code:
    @Override
    protected void onRender(Element parent, int pos) {
    super.onRender(parent, pos);
    
    FormPanel panel = new FormPanel();
    //ContentPanel panel = new ContentPanel();
    //panel.setLayout(new FitLayout());
    panel.setFrame(true);
    // panel.setFieldWidth(210);
    // panel.setLabelWidth(100);
    panel.setButtonAlign(HorizontalAlignment.CENTER);
    panel.setHeading("Simple Form");
    //panel.setIconStyle("icon-form");
    panel.setWidth(400);
    //panel.setStyleAttribute("padding", "20");
    
    TextField text = new TextField();
    text.setFieldLabel("Name");
    text.setEmptyText("Enter your full name");
    text.setAllowBlank(false);
    text.setMinLength(4);
    panel.add(text);
    
    NumberField number = new NumberField();
    number.setFieldLabel("Age");
    number.setEmptyText("Enter your age");
    number.setAllowBlank(false);
    panel.add(number);
    
    text = new TextField();
    text.setFieldLabel("Email");
    panel.add(text);
    
    DateField date = new DateField();
    date.setFieldLabel("Birthday");
    date.setWidth(210);
    panel.add(date);
    
    TimeField time = new TimeField();
    time.setFieldLabel("Time");
    time.setWidth(200);
    panel.add(time);
    
    CheckBox check1 = new CheckBox();
    check1.setBoxLabel("Classical");
    
    CheckBox check2 = new CheckBox();
    check2.setBoxLabel("Rock");
    check2.setValue(true);
    
    CheckBox check3 = new CheckBox();
    check3.setFieldLabel("Blue");
    
    CheckBoxGroup checkGroup = new CheckBoxGroup();
    checkGroup.setFieldLabel("Music");
    checkGroup.add(check1);
    checkGroup.add(check2);
    checkGroup.add(check3);
    panel.add(checkGroup);
    
    Radio radio = new Radio();
    radio.setName("radio");
    radio.setFieldLabel("Red");
    radio.setValue(true);
    
    Radio radio2 = new Radio();
    radio2.setName("radio");
    radio2.setFieldLabel("Blue");
    
    RadioGroup radioGroup = new RadioGroup("test");
    radioGroup.setFieldLabel("Favorite Color");
    radioGroup.add(radio);
    radioGroup.add(radio2);
    panel.add(radioGroup);
    
    TextArea description = new TextArea();
    description.setPreventScrollbars(true);
    description.setInitialHeight(50);
    description.setFieldLabel("Description");
    panel.add(description);
    
    panel.addButton(new Button("Save"));
    panel.addButton(new Button("Cancel"));
    //fpanel.add(panel);
    
    add(panel);
    }

  5. #5
    Ext User
    Join Date
    May 2008
    Posts
    5
    Vote Rating
    0
    bdp11 is on a distinguished road

      0  

    Default Thanks

    Thanks


    Thanks for reply ,
    But this is the original code from the site that i tried to modify with contentPanel by adding it to formpanel , which you can find in my previous replies exactly what i was trying to do.
    so I just want to find out whether we can add multiple contentpanels to formpanel or not ..

    Thanks for your reponse.

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


    Sorry - missed that part.

    No, I don't believe you can add ContentPanels to FormPanels.

    You can only add the objects defined in com.extjs.gxt.ui.client.widget.form

  7. #7
    Ext User
    Join Date
    Apr 2008
    Posts
    376
    Vote Rating
    0
    zaccret is on a distinguished road

      0  

    Default


    I also think that you can only add Fields in a FormPanel. Darell, it would be nice to :
    - say that in the javadoc,
    - and throw an exception when someone want to add anything else than Fields and/or add an add(Field) method.

  8. #8
    Ext User
    Join Date
    May 2008
    Posts
    5
    Vote Rating
    0
    bdp11 is on a distinguished road

      0  

    Default


    I spent almost a day to make that work and now i know that is not possible

    but Thanks for your help.

Thread Participants: 2