GWT - Widget FormPanel

introduction

le FormPanel widget représente un panneau qui enveloppe son contenu dans un élément HTML <FORM>.

Déclaration de classe

Voici la déclaration pour com.google.gwt.user.client.ui.FormPanel classe -

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

Constructeurs de classe

N ° Sr. Constructeur et description
1

FormPanel()

Crée un nouveau FormPanel.
2

protected FormPanel(Element element)

Ce constructeur peut être utilisé par des sous-classes pour utiliser explicitement un élément existant.
3

protected FormPanel(Element element, boolean createIFrame)

Ce constructeur peut être utilisé par des sous-classes pour utiliser explicitement un élément existant.
4

FormPanel(NamedFrame frameTarget)

Crée un FormPanel qui cible un NamedFrame.
5

FormPanel(java.lang.String target)

Crée un nouveau FormPanel.

Méthodes de classe

N ° Sr. Nom de la fonction et description
1

void add Form Handler (FormHandler handler)

Obsolète. Utilisez add Submit Complete Handler (com.google.gwt.user.client.ui.Form Panel.Submit Complete Handler) et ajoutez Submit Handler (com.google.gwt.user.client.ui.Form Panel.Submit Handler) à la place
2

Handler Registration addSubmit Complete Handler (FormPanel.SubmitCompleteHandler handler)

Ajoute un gestionnaire d'événements FormPanel.Submit Complete.
3

HandlerRegistration addSubmitHandler(FormPanel.SubmitHandler handler)

Ajoute un gestionnaire FormPanel.SubmitEvent.
4

java.lang.String getAction()

Obtient «l'action» associée à ce formulaire.
5

java.lang.String getEncoding()

Obtient l'encodage utilisé pour soumettre ce formulaire.
6

java.lang.String getMethod()

Obtient la méthode HTTP utilisée pour soumettre ce formulaire.
sept

java.lang.String getTarget()

Obtient la «cible» du formulaire.
8

protected void onAttach()

Cette méthode est appelée lorsqu'un widget est attaché au document du navigateur.
9

protected void onDetach()

Cette méthode est appelée lorsqu'un widget est détaché du document du navigateur.
dix

boolean onFormSubmit()

Déclenché lorsqu'un formulaire est soumis.
11

void onFrameLoad()
12

void removeFormHandler(FormHandler handler)

Obsolète. Utilisez la méthode HandlerRegistration.removeHandler () sur l'objet retourné par et ajoutez la méthode * Handler à la place
13

void reset()

Réinitialise le formulaire en effaçant tous les champs.
14

void setAction(java.lang.String url)

Définit «l'action» associée à ce formulaire.
15

void setEncoding(java.lang.String encodingType)

Définit le codage utilisé pour soumettre ce formulaire.
16

void setMethod(java.lang.String method)

Définit la méthode HTTP utilisée pour soumettre ce formulaire.
17

void submit()

Soumet le formulaire.
18

static FormPanel wrap(Element element)

Crée un FormPanel qui encapsule un élément <form> existant.
19

static FormPanel wrap(Element element, boolean createIFrame)

Crée un FormPanel qui encapsule un élément <form> existant.

Méthodes héritées

Cette classe hérite des méthodes des classes suivantes -

  • 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

Exemple de widget FormPanel

Cet exemple vous guidera à travers des étapes simples pour montrer l'utilisation d'un widget FormPanel dans GWT. Suivez les étapes suivantes pour mettre à jour l'application GWT que nous avons créée dans GWT - Chapitre Créer une application -

Étape La description
1 Créez un projet avec un nom HelloWorld sous un package com.tutorialspoint comme expliqué dans le chapitre GWT - Créer une application .
2 Modifiez HelloWorld.gwt.xml , HelloWorld.css , HelloWorld.html et HelloWorld.java comme expliqué ci-dessous. Gardez le reste des fichiers inchangé.
3 Compilez et exécutez l'application pour vérifier le résultat de la logique implémentée.

Voici le contenu du descripteur de module modifié 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>

Voici le contenu du fichier de feuille de style modifié 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;
}

Voici le contenu du fichier hôte HTML modifié 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>

Laissez-nous avoir le contenu suivant du fichier Java src/com.tutorialspoint/HelloWorld.java qui démontrera l'utilisation du 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);
   }

}

Une fois que vous êtes prêt avec tous les changements effectués, laissez-nous compiler et exécuter l'application en mode développement comme nous l'avons fait dans le chapitre GWT - Créer une application . Si tout va bien avec votre application, cela produira le résultat suivant -