无需刷新或转发即可上传GWT表单

时间:2013-11-23 10:28:59

标签: java gwt

我想知道GWT应该做些什么com.google.gwt.user.client.ui.FileUpload 无需刷新或转发即可上传到服务器。

我已经从此Java Doc实施了表单上传,但是它将浏览器页面转发到目标服务器URL。

如何在不转发的情况下实现表单上传?

更新

    final FormPanel form = new FormPanel();
    form.setAction("/upload");
    form.setEncoding(FormPanel.ENCODING_MULTIPART); 
    form.setMethod(FormPanel.METHOD_POST);

    VerticalPanel panel = new VerticalPanel();
    form.setWidget(panel);
    final TextBox tb = new TextBox();
    tb.setName("textBoxFormElement");
    panel.add(tb);

    // Create a FileUpload widget.
    FileUpload upload = new FileUpload();
    upload.setName("uploadFormElement");
    panel.add(upload);      

    DOM.getElementById("form_panel").appendChild(panel.getElement());

    Button submit = new Button("Submit");
    panel.add(submit);

    DOM.sinkEvents(submit.getElement(), Event.ONCLICK);
    DOM.setEventListener(submit.getElement(), new EventListener(){
    @Override
    public void onBrowserEvent(Event event) {
        if (event.getTypeInt() == Event.ONCLICK) {
            form.submit();
            return;
        }
    }});
    form.addSubmitHandler(new FormPanel.SubmitHandler() {
      public void onSubmit(SubmitEvent event) {
        if (tb.getText().length() == 0) {
          Window.alert("The text box must not be empty");
          event.cancel();
        }
      }
    });
    form.addSubmitCompleteHandler(new FormPanel.SubmitCompleteHandler() {
      public void onSubmitComplete(SubmitCompleteEvent event) {
        Window.alert(event.getResults());
      }
    }); 

2 个答案:

答案 0 :(得分:2)

IMO你让事情变得比现在更复杂。

我不明白为什么,如果您正在使用小部件,那么您正试图手动管理DOM。

1.-使用GWT方式将表单面板附加到根面板,否则您将打破窗口小部件层次结构。

 RootPanel.get("form_panel").add(panel);

2.-尽量不要手动使用sink事件,并使用小部件中已有的方法:

 submit.addClickHandler(new ClickHandler() {
   public void onClick(ClickEvent event) {
      form.submit();
   }
 });

FormPanel将其目标设置为隐藏的<iframe>,因此您永远不会被重定向到其他网页。

顺便说一句,我宁愿使用gwtupload库来简化GWT中的上传代码,并添加了许多其他功能。

答案 1 :(得分:1)

我在gwt-upload库之前使用过。

你不需要重新发现美国。

感谢moxie group

gwt-upload-project page