1. #1
    Ext User fother's Avatar
    Join Date
    Sep 2007
    Location
    Brazil
    Posts
    744
    Vote Rating
    -1
    fother is an unknown quantity at this point

      0  

    Default [CLOSED] layout issue when add a FileUploadField in HorizontalPanel

    [CLOSED] layout issue when add a FileUploadField in HorizontalPanel


    see the image in attachment.

    Code:
    	public void onModuleLoad() {
    
    		final FormPanel form = new FormPanel();
    		form.setAction("Example");
    		form.setMethod(Method.POST);
    		form.setEncoding(Encoding.URLENCODED);
    
    		HorizontalPanel panel1 = new HorizontalPanel();
    		panel1.add(new TextField<String>());
    		panel1.add(new Text("Text 1"));
    		panel1.add(new Text("Text 2"));
    
    		HorizontalPanel panel2 = new HorizontalPanel();
    		panel2.add(new FileUploadField());
    		panel2.add(new Text("Text 1"));
    		panel2.add(new Text("Text 2"));
    
    		HorizontalPanel panel3 = new HorizontalPanel();
    		panel3.add(new TextField<String>());
    		panel3.add(new Text("Text 1"));
    		panel3.add(new Text("Text 2"));
    
    		FieldSet fieldSet = new FieldSet();
    		fieldSet.setHeading("FieldSet");
    		fieldSet.add(panel1);
    		fieldSet.add(panel2);
    		fieldSet.add(panel3);
    
    		form.add(fieldSet);
    
    		RootPanel.get().add(form);
    	}
    Attached Images

  2. #2
    Ext User fother's Avatar
    Join Date
    Sep 2007
    Location
    Brazil
    Posts
    744
    Vote Rating
    -1
    fother is an unknown quantity at this point

      0  

    Default


    If I use com.google.gwt.user.client.ui.FileUpload work fine

  3. #3
    Sencha User
    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


    Fixed in SVN.

  4. #4
    Ext User fother's Avatar
    Join Date
    Sep 2007
    Location
    Brazil
    Posts
    744
    Vote Rating
    -1
    fother is an unknown quantity at this point

      0  

    Default


    now test with this... click in show button.. and you will see the problem.. the button browser of file upload don't appear for the user change the file

    GXT: 1.2.2
    GWT: 1.5.3
    Firefox: 3.0.5

    Code:
    import com.extjs.gxt.ui.client.event.ComponentEvent;
    import com.extjs.gxt.ui.client.event.SelectionListener;
    import com.extjs.gxt.ui.client.widget.HorizontalPanel;
    import com.extjs.gxt.ui.client.widget.MessageBox;
    import com.extjs.gxt.ui.client.widget.Text;
    import com.extjs.gxt.ui.client.widget.button.Button;
    import com.extjs.gxt.ui.client.widget.form.FieldSet;
    import com.extjs.gxt.ui.client.widget.form.FileUploadField;
    import com.extjs.gxt.ui.client.widget.form.FormPanel;
    import com.google.gwt.core.client.EntryPoint;
    import com.google.gwt.user.client.ui.RootPanel;
    
    public class App implements EntryPoint {
    
    	public void onModuleLoad() {
    
    		HorizontalPanel hp = new HorizontalPanel();
    
    		final FileUploadField upload = new FileUploadField();
    
    		final Button clickButton = new Button("Click");
    		clickButton.addSelectionListener(new SelectionListener<ComponentEvent>() {
    
    			@Override
    			public void componentSelected(ComponentEvent ce) {
    				MessageBox.alert(null, "click", null);
    			}
    		});
    
    		final Button hideButton = new Button("hide");
    		final Button showButton = new Button("show");
    
    		showButton.setStyleAttribute("paddingLeft", "20px");
    		showButton.addSelectionListener(new SelectionListener<ComponentEvent>() {
    
    			@Override
    			public void componentSelected(ComponentEvent ce) {
    
    				clickButton.hide();
    				showButton.hide();
    
    				hideButton.show();
    
    				upload.show();
    			}
    		});
    
    		hideButton.setStyleAttribute("paddingLeft", "20px");
    		hideButton.addSelectionListener(new SelectionListener<ComponentEvent>() {
    
    			@Override
    			public void componentSelected(ComponentEvent ce) {
    
    				clickButton.show();
    				showButton.show();
    
    				hideButton.hide();
    
    				upload.hide();
    			}
    		});
    
    		hp.add(upload);
    		hp.add(showButton);
    		hp.add(hideButton);
    		hp.add(clickButton);
    
    		hideButton.hide();
    		upload.hide();
    
    		FieldSet fieldSet = new FieldSet();
    		fieldSet.add(new Text("Text would be display on top"));
    		fieldSet.add(hp);
    
    		FormPanel form = new FormPanel();
    		form.add(fieldSet);
    
    		RootPanel.get().add(form);
    
    	}
    }
    Attached Images
    Last edited by fother; 29 Jan 2009 at 4:57 AM. Reason: added attachment

  5. #5
    Sencha User
    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


    TableLayout is the wrong layout if you need widgets to resize.

    For your example you would need to hide the uploadfield after the panel was rendered.

  6. #6
    Ext User fother's Avatar
    Join Date
    Sep 2007
    Location
    Brazil
    Posts
    744
    Vote Rating
    -1
    fother is an unknown quantity at this point

      0  

    Default


    you is the the html, css and js machine kkkk what you know all this? thanks

  7. #7
    Sencha User
    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


    Code:
    showButton.addSelectionListener(new SelectionListener<ComponentEvent>() {
    
            @Override
            public void componentSelected(ComponentEvent ce) {
    
                clickButton.hide();
                showButton.hide();
    
                hideButton.show();
    
                upload.show();
                upload.setWidth(150);
            }
        });
    This also works.

  8. #8
    Ext User fother's Avatar
    Join Date
    Sep 2007
    Location
    Brazil
    Posts
    744
    Vote Rating
    -1
    fother is an unknown quantity at this point

      0  

    Default


    this soluction is better than other... but why I need set the width?

  9. #9
    Ext User fother's Avatar
    Join Date
    Sep 2007
    Location
    Brazil
    Posts
    744
    Vote Rating
    -1
    fother is an unknown quantity at this point

      0  

    Default


    tested on: vista 64bits, hosted mode, gwt: 1.5.3, gxt 1.2.3

    Code:
    	public void onModuleLoad() {
    
    		HorizontalPanel hp = new HorizontalPanel();
    
    		final FileUploadField upload = new FileUploadField();
    		upload.setWidth(150);
    
    		final Button clickButton = new Button("Click");
    		clickButton.addSelectionListener(new SelectionListener<ComponentEvent>() {
    
    			@Override
    			public void componentSelected(ComponentEvent ce) {
    				MessageBox.alert(null, "click", null);
    			}
    		});
    
    		final Button hideButton = new Button("hide");
    		final Button showButton = new Button("show");
    
    		showButton.setStyleAttribute("paddingLeft", "20px");
    		showButton.addSelectionListener(new SelectionListener<ComponentEvent>() {
    
    			@Override
    			public void componentSelected(ComponentEvent ce) {
    
    				clickButton.hide();
    				showButton.hide();
    
    				hideButton.show();
    
    				upload.show();
    				upload.setWidth(150);
    			}
    		});
    
    		hideButton.setStyleAttribute("paddingLeft", "20px");
    		hideButton.addSelectionListener(new SelectionListener<ComponentEvent>() {
    
    			@Override
    			public void componentSelected(ComponentEvent ce) {
    
    				clickButton.show();
    				showButton.show();
    
    				hideButton.hide();
    
    				upload.hide();
    			}
    		});
    
    		hp.add(upload);
    		hp.add(showButton);
    		hp.add(hideButton);
    		hp.add(clickButton);
    
    		hideButton.hide();
    		upload.hide();
    
    		FieldSet fieldSet = new FieldSet();
    		fieldSet.add(new Text("Text would be display on top"));
    		fieldSet.add(hp);
    
    		FormPanel form = new FormPanel();
    		form.add(fieldSet);
    
    		RootPanel.get().add(form);
    
    	}
    exception

    Code:
    
    [ERROR] Uncaught exception escaped
    com.google.gwt.core.client.JavaScriptException: (Error): Argumento inválido.
     number: -2147024809
     description: Argumento inválido.
    	at com.google.gwt.dom.client.Node$.removeChild$(Native Method)
    	at com.extjs.gxt.ui.client.widget.form.FormPanel.onDetach(FormPanel.java:448)
    	at com.google.gwt.user.client.ui.Panel.doDetachChildren(Panel.java:174)
    	at com.google.gwt.user.client.ui.Widget.onDetach(Widget.java:146)
    	at com.google.gwt.user.client.ui.RootPanel.detachWidgets(RootPanel.java:194)
    	at com.google.gwt.user.client.ui.RootPanel$1.onWindowClosed(RootPanel.java:221)
    	at com.google.gwt.user.client.Window.fireClosedImpl(Window.java:465)
    	at com.google.gwt.user.client.Window.fireClosedAndCatch(Window.java:456)
    	at com.google.gwt.user.client.Window.onClosed(Window.java:430)
    

  10. #10
    Ext User fother's Avatar
    Join Date
    Sep 2007
    Location
    Brazil
    Posts
    744
    Vote Rating
    -1
    fother is an unknown quantity at this point

      0  

    Default


    if I compile and test.. only in IE don't work.. firefox, safari and chrome work fine

Thread Participants: 1