FormPanel spawning new tab in Chrome after submit

[scaswell1]

Hi,

The GXT 3.0.3 FormPanel widget is spawning a new tab/window in Google Chrome v24 after submit completes. How can I get this to stop?

Thanks!

[sven]

This sounds like a bug. Thanks for reporting.

I will move this thread to the bugs forum for further investigation. We will look into getting this fixed

[scaswell1]

Thanks, Sven.

My Google Chrome reports it is running Version 24.0.1312.52 m, for your reference.

[Colin Alworth]

I'm unable to reproduce this using this test case:

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;
import com.sencha.gxt.widget.core.client.ContentPanel;
import com.sencha.gxt.widget.core.client.button.TextButton;
import com.sencha.gxt.widget.core.client.event.SelectEvent;
import com.sencha.gxt.widget.core.client.event.SelectEvent.SelectHandler;
import com.sencha.gxt.widget.core.client.form.FormPanel;

public class Test implements EntryPoint {

  public void onModuleLoad() {
    final FormPanel panel = new FormPanel();
    panel.setAction("http://sencha.com");
    panel.setWidget(new TextButton("Submit", new SelectHandler() {
      @Override
      public void onSelect(SelectEvent event) {
        panel.submit();
      }
    }));
    ContentPanel gxtFormPanelWrapper = new ContentPanel();
    gxtFormPanelWrapper.setHeadingText("GXT FormPanel");
    gxtFormPanelWrapper.setWidget(panel);

    RootPanel.get().add(gxtFormPanelWrapper);


    final com.google.gwt.user.client.ui.FormPanel panel2 = new com.google.gwt.user.client.ui.FormPanel();
    panel2.setAction("http://sencha.com");
    panel2.setWidget(new TextButton("Submit", new SelectHandler() {
      @Override
      public void onSelect(SelectEvent event) {
        panel2.submit();
      }
    }));
    ContentPanel gwtFormPanelWrapper = new ContentPanel();
    gwtFormPanelWrapper.setHeadingText("GWT FormPanel");
    gwtFormPanelWrapper.setWidget(panel2);

    RootPanel.get().add(gwtFormPanelWrapper);
  }
}

I tested both with the GWT FormPanel and the GXT FormPanel, just in case there was some difference. I performed this test using GWT 2.4.0 and GXT 3.0.3, and am running Chrome 24.0.1312.52.

[scaswell1]

Colin,

We have upgraded to GXT 2.5.0, which seems to be the only difference between our two cases. And, to clarify, we are using the GXT FormPanel (in case there is indeed any difference between it and the GWT FormPanel.)

Here's pretty much what our code is doing.

    /** File upload form. */
    private FormPanel form = new FormPanel();    form.setMethod(FormPanel.Method.POST);
    form.setEncoding(FormPanel.Encoding.MULTIPART);
    form.setAction(GWT.getHostPageBaseURL() + "datatransfer");
    form.addSubmitHandler(new SubmitHandler() {


        @Override
        public void onSubmit(SubmitEvent event) {
            // after submit processing

            uploader.hide();
        }
    });

        // then there's a button they can click which calls form.submit();

[Colin Alworth]

The 'uploader' variable appears to be a Window, or some kind of dialog, or perhaps a progress message?

Here's a modified example, compiled with GWT 2.5.0 and GXT 3.0.3 that doesn not exhibit the behavior you are describing in Chrome 24 for me. Can you run this simple entrypoint and confirm that the bug is not occurring? Assuming so, can you try to make this more like your use case where the bug *is* happening?

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.core.client.GWT;
import com.google.gwt.user.client.ui.RootPanel;
import com.sencha.gxt.widget.core.client.ContentPanel;
import com.sencha.gxt.widget.core.client.button.TextButton;
import com.sencha.gxt.widget.core.client.event.SelectEvent;
import com.sencha.gxt.widget.core.client.event.SelectEvent.SelectHandler;
import com.sencha.gxt.widget.core.client.event.SubmitEvent;
import com.sencha.gxt.widget.core.client.event.SubmitEvent.SubmitHandler;
import com.sencha.gxt.widget.core.client.form.FormPanel;

public class Test implements EntryPoint {

  public void onModuleLoad() {
    final FormPanel form = new FormPanel();
    form.setMethod(FormPanel.Method.POST);
    form.setEncoding(FormPanel.Encoding.MULTIPART);
    form.setAction(GWT.getHostPageBaseURL() + "datatransfer");
    
    form.addSubmitHandler(new SubmitHandler() {
        @Override
        public void onSubmit(SubmitEvent event) {
            // after submit processing

//            uploader.hide();
        }
    });

        // then there's a button they can click which calls form.submit();
    form.setWidget(new TextButton("Submit", new SelectHandler() {
      @Override
      public void onSelect(SelectEvent event) {
        form.submit();
      }
    }));
    ContentPanel gxtFormPanelWrapper = new ContentPanel();
    gxtFormPanelWrapper.setHeadingText("GXT FormPanel");
    gxtFormPanelWrapper.setWidget(form);

    RootPanel.get().add(gxtFormPanelWrapper);
  }
}

I've also attached a zip containing the compiled files so you can test in your own browser, to ensure there isn't some other difference. I've compiled with <collapse-all-properties /> in my module to keep the compiled size down.

[scaswell1]

Hmmm. I also cannot reproduce the issue with the code you have provided. Let me take some more time to look into this.

[scaswell1]

Colin,

In my debugging, I am finding that the following is the case:

In the FormPanel.submit method, line 370

 impl.submit(getElement(), synthesizedFrame);

The synthesizedFrame variable is null. In the FormPanel's onAttach code, I see the following:

      // Create and attach a hidden iframe to the body element.
      createFrame();
      Document.get().getBody().appendChild(synthesizedFrame);

And finally, in createFrame, the following comment exists:

// Attach a hidden IFrame to the form. This is the target iframe to which
// the form will be submitted.

Perhaps the target iframe being null is why I'm getting the new tab/window onsubmit? If so, how can I fix this target synthesizedFrame from being null?

[scaswell1]

Also, after the onAttach method runs

    // Hook up the underlying iframe's onLoad event when attached to the DOM.
    // Making this connection only when attached avoids memory-leak issues.
    // The FormPanel cannot use the built-in GWT event-handling mechanism
    // because there is no standard onLoad event on iframes that works across
    // browsers.
    impl.hookEvents(synthesizedFrame, getElement(), this);

My debugger ends up at line 34 of AttachDetachException.java

[Colin Alworth]

If the FormPanel is not attached, it cannot properly submit, nor can it receive events. It sounds like you are telling me that your use case involves showing a window, hiding it, submitting it, and waiting for any updates to occur.

Instead, the FormPanel must* be attached somewhere. Can you try modifying your code to keep it attached (or re-attach it), and see if it solves this issue?

* In truth, it isn't quite as strictly required as I make it sound, but to to properly follow the GWT pattern of attach/detach and cleaning up any possible memory leaks, we need to do cleanup on detach. FormPanel could (possibly, I havent tested) be implemented to work in this way, at the risk of introducing memory leaks into all applications that use it.