GWT - Widget FormPanel

introduzione

Il FormPanel widget rappresenta un pannello che racchiude i suoi contenuti in un elemento HTML <FORM>.

Dichiarazione di classe

Di seguito è riportata la dichiarazione per com.google.gwt.user.client.ui.FormPanel classe -

public class FormPanel
   extends SimplePanel
      implements FiresFormEvents, 
         com.google.gwt.user.client.ui.impl.FormPanelImplHost

Costruttori di classi

Sr.No. Costruttore e descrizione
1

FormPanel()

Crea un nuovo FormPanel.
2

protected FormPanel(Element element)

Questo costruttore può essere utilizzato dalle sottoclassi per utilizzare esplicitamente un elemento esistente.
3

protected FormPanel(Element element, boolean createIFrame)

Questo costruttore può essere utilizzato dalle sottoclassi per utilizzare esplicitamente un elemento esistente.
4

FormPanel(NamedFrame frameTarget)

Crea un FormPanel che ha come destinazione un NamedFrame.
5

FormPanel(java.lang.String target)

Crea un nuovo FormPanel.

Metodi di classe

Sr.No. Nome e descrizione della funzione
1

void add Form Handler (FormHandler handler)

Deprecato. Utilizza add Submit Complete Handler (com.google.gwt.user.client.ui.Form Panel.Submit Complete Handler) e aggiungi invece Submit Handler (com.google.gwt.user.client.ui.Form Panel.Submit Handler)
2

Handler Registration addSubmit Complete Handler (FormPanel.SubmitCompleteHandler handler)

Aggiunge un gestore di eventi completo FormPanel.Submit.
3

HandlerRegistration addSubmitHandler(FormPanel.SubmitHandler handler)

Aggiunge un gestore FormPanel.SubmitEvent.
4

java.lang.String getAction()

Ottiene l '"azione" associata a questo modulo.
5

java.lang.String getEncoding()

Ottiene la codifica utilizzata per inviare questo modulo.
6

java.lang.String getMethod()

Ottiene il metodo HTTP utilizzato per inviare questo modulo.
7

java.lang.String getTarget()

Ottiene la "destinazione" del modulo.
8

protected void onAttach()

Questo metodo viene chiamato quando un widget è allegato al documento del browser.
9

protected void onDetach()

Questo metodo viene chiamato quando un widget viene scollegato dal documento del browser.
10

boolean onFormSubmit()

Licenziato quando viene inviato un modulo.
11

void onFrameLoad()
12

void removeFormHandler(FormHandler handler)

Deprecato. Usa il metodo HandlerRegistration.removeHandler () sull'oggetto restituito da e aggiungi invece il metodo * Handler
13

void reset()

Reimposta il modulo, cancellando tutti i campi.
14

void setAction(java.lang.String url)

Imposta l '"azione" associata a questo modulo.
15

void setEncoding(java.lang.String encodingType)

Imposta la codifica utilizzata per inviare questo modulo.
16

void setMethod(java.lang.String method)

Imposta il metodo HTTP utilizzato per inviare questo modulo.
17

void submit()

Invia il modulo.
18

static FormPanel wrap(Element element)

Crea un FormPanel che racchiude un elemento <form> esistente.
19

static FormPanel wrap(Element element, boolean createIFrame)

Crea un FormPanel che racchiude un elemento <form> esistente.

Metodi ereditati

Questa classe eredita i metodi dalle seguenti classi:

  • com.google.gwt.user.client.ui.UIObject

  • com.google.gwt.user.client.ui.Widget

  • com.google.gwt.user.client.ui.Panel

  • com.google.gwt.user.client.ui.SimplePanel

  • java.lang.Object

Esempio di widget FormPanel

Questo esempio ti guiderà attraverso semplici passaggi per mostrare l'utilizzo di un widget FormPanel in GWT. Segui i seguenti passaggi per aggiornare l'applicazione GWT che abbiamo creato in GWT - Capitolo Crea applicazione -

Passo Descrizione
1 Crea un progetto con un nome HelloWorld sotto un pacchetto com.tutorialspoint come spiegato nel capitolo GWT - Crea applicazione .
2 Modifica HelloWorld.gwt.xml , HelloWorld.css , HelloWorld.html e HelloWorld.java come spiegato di seguito. Mantieni il resto dei file invariato.
3 Compilare ed eseguire l'applicazione per verificare il risultato della logica implementata.

Di seguito è riportato il contenuto del descrittore del modulo modificato src/com.tutorialspoint/HelloWorld.gwt.xml.

<?xml version = "1.0" encoding = "UTF-8"?>
<module rename-to = 'helloworld'>
   <!-- Inherit the core Web Toolkit stuff.                        -->
   <inherits name = 'com.google.gwt.user.User'/>

   <!-- Inherit the default GWT style sheet.                       -->
   <inherits name = 'com.google.gwt.user.theme.clean.Clean'/>

   <!-- Specify the app entry point class.                         -->
   <entry-point class = 'com.tutorialspoint.client.HelloWorld'/>

   <!-- Specify the paths for translatable code                    -->
   <source path = 'client'/>
   <source path = 'shared'/>

</module>

Di seguito è riportato il contenuto del file del foglio di stile modificato war/HelloWorld.css.

body {
   text-align: center;
   font-family: verdana, sans-serif;
}

h1 {
   font-size: 2em;
   font-weight: bold;
   color: #777777;
   margin: 40px 0px 70px;
   text-align: center;
}

Di seguito è riportato il contenuto del file host HTML modificato war/HelloWorld.html.

<html>
   <head>
      <title>Hello World</title>
      <link rel = "stylesheet" href = "HelloWorld.css"/>
      <script language = "javascript" src = "helloworld/helloworld.nocache.js">
      </script>
   </head>

   <body>
      <h1>FormPanel Widget Demonstration</h1>
      <div id = "gwtContainer"></div>
   </body>
</html>

Cerchiamo di avere il seguente contenuto del file Java src/com.tutorialspoint/HelloWorld.java che dimostrerà l'uso del widget FormPanel.

package com.tutorialspoint.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.DecoratorPanel;
import com.google.gwt.user.client.ui.FileUpload;
import com.google.gwt.user.client.ui.FormPanel;
import com.google.gwt.user.client.ui.FormPanel.SubmitCompleteEvent;
import com.google.gwt.user.client.ui.FormPanel.SubmitEvent;
import com.google.gwt.user.client.ui.ListBox;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.TextBox;
import com.google.gwt.user.client.ui.VerticalPanel;

public class HelloWorld implements EntryPoint {

   public void onModuleLoad() {
      // Create a FormPanel and point it at a service.
      final FormPanel form = new FormPanel();
      form.setAction("/myFormHandler");

      // Because we're going to add a FileUpload widget, 
      // we'll need to set the form to use the POST method, 
      // and multipart MIME encoding.
      form.setEncoding(FormPanel.ENCODING_MULTIPART);
      form.setMethod(FormPanel.METHOD_POST);

      // Create a panel to hold all of the form widgets.
      VerticalPanel panel = new VerticalPanel();
      panel.setSpacing(10);
      form.setWidget(panel);

      // Create a TextBox, giving it a name so that it will be submitted.
      final TextBox tb = new TextBox();
      tb.setWidth("220");

      tb.setName("textBoxFormElement");
      panel.add(tb);

      // Create a ListBox, giving it a name and 
      // some values to be associated with its options.
      ListBox lb = new ListBox();
      lb.setName("listBoxFormElement");
      lb.addItem("item1", "item1");
      lb.addItem("item2", "item2");
      lb.addItem("item3", "item3");
      lb.setWidth("220");
      panel.add(lb);

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

      // Add a 'submit' button.
      panel.add(new Button("Submit", new ClickHandler() {
         @Override
         public void onClick(ClickEvent event) {
            form.submit();					
         }
      }));

      // Add an event handler to the form.
      form.addSubmitHandler(new FormPanel.SubmitHandler() {
         @Override
         public void onSubmit(SubmitEvent event) {
            // This event is fired just before the form is submitted. 
            // We can take this opportunity to perform validation.
            if (tb.getText().length() == 0) {
               Window.alert("The text box must not be empty");
               event.cancel();
            }					
         }
      });

      form.addSubmitCompleteHandler(new FormPanel.SubmitCompleteHandler() {
         @Override
         public void onSubmitComplete(SubmitCompleteEvent event) {
            // When the form submission is successfully completed,
            // this event is fired. Assuming the service returned 
            // a response of type text/html, we can get the result
            // here.
            Window.alert(event.getResults());					
         }
      });

      DecoratorPanel decoratorPanel = new DecoratorPanel();
      decoratorPanel.add(form);
      // Add the widgets to the root panel.
      RootPanel.get().add(decoratorPanel);
   }

}

Una volta che sei pronto con tutte le modifiche apportate, compiliamo ed eseguiamo l'applicazione in modalità sviluppo come abbiamo fatto nel capitolo GWT - Crea applicazione . Se tutto va bene con la tua applicazione, questo produrrà il seguente risultato: