Data Binding

Ouvrir dans ChatGPT

webforJ inclut une fonctionnalité de liaison de données qui intègre les composants de l'interface utilisateur avec les modèles de données backend dans les applications Java. Cette fonctionnalité comble le fossé entre l'UI et la couche de données, de sorte que les modifications de l'interface utilisateur se réfléchissent dans le modèle de données et vice versa, réduisant ainsi la complexité de la gestion des événements et de la synchronisation des données.

Concept

La démonstration suivante présente une application webforJ simple pour enregistrer des super-héros en utilisant la liaison de données webforJ. L'application se compose de deux parties principales : HeroRegistration.java et Hero.java.

Dans HeroRegistration.java, le code configure l'interface utilisateur avec un TextField pour entrer le nom du héros, un ComboBox pour sélectionner un super pouvoir, et un Button pour soumettre l'enregistrement.

La classe Hero définit le modèle de données avec des contraintes de validation sur le nom et le pouvoir du héros. Les entrées doivent être valides et respecter des critères spécifiés tels que la longueur et le motif.

L'application utilise le BindingContext pour lier les composants de l'interface utilisateur aux propriétés de l'objet Hero. Lorsqu'un utilisateur clique sur le bouton de soumission, l'application écrit les données saisies dans le formulaire de retour au bean Hero si elles sont valides.

HeroRegistration.java
Hero.java

public class HeroRegistration extends App {
    
  private TextField name = new TextField("Text Field");
  private ComboBox power = new ComboBox("Power");
  private Button submit = new Button("Submit Application");
  private FlexLayout layout = FlexLayout.create(name, power, submit).vertical().build()
      .setStyle("margin", "20px auto").setMaxWidth("400px");

  @Override
  public void run() throws WebforjException {
    power.insert("Fly", "Invisible", "LaserVision", "Speed", "Teleportation");

    BindingContext<Hero> context = BindingContext.of(this, Hero.class, true);
    Hero bean = new Hero("Superman", "Fly");

    // reflect the bean data in the form
    context.read(bean);

    submit.onClick(e -> {
      // write the form data back to the bean
      ValidationResult results = context.write(bean);

      if (results.isValid()) {
        // do something with the bean
        // repository.persist(bean)
      }
    });

    Frame frame = new Frame();
    frame.add(layout);
  }
}

public class Hero {

  @NotEmpty(message = "Name cannot be empty")
  @Length(min = 3, max = 20)
  private String name;

  @NotEmpty(message = "Unspecified power")
  @Pattern(regexp = "Fly|Invisible|LaserVision|Speed|Teleportation", message = "Invalid power")
  private String power;

  public Hero(String name, String power) {
    this.name = name;
    this.power = power;
  }

  public String getName() {
    return name;
  }

  public void setName(String name) {
    this.name = name;
  }

  public String getPower() {
    return power;
  }

  public void setPower(String power) {
    this.power = power;
  }

  public String toString() {
    return "Name: " + name + ", Power: " + power;
  }
}

Key features

Liaison Bidirectionnelle : Prend en charge la liaison de données bidirectionnelle, permettant aux modifications du modèle de données de mettre à jour l'interface utilisateur, et aux interactions des utilisateurs dans l'interface utilisateur de mettre à jour le modèle de données.
Support de Validation : Intègre des mécanismes de validation complets que vous pouvez personnaliser et étendre. Les développeurs peuvent mettre en œuvre leurs propres règles de validation ou utiliser des frameworks de validation existants comme Jakarta Validation pour vérifier l'intégrité des données avant de mettre à jour le modèle.
Extensibilité : Peut être facilement étendue pour prendre en charge différents types de composants de l'interface utilisateur, des transformations de données et des scénarios de validation complexes.
Configuration Basée sur Annotations : Utilise des annotations pour minimiser le code boilerplate, rendant les liaisons entre les composants de l'interface utilisateur et les modèles de données déclaratives et faciles à gérer.

Topics

Ouvrir dans ChatGPT

📄️ Bindings

Un lien dans webforJ relie une propriété spécifique d'un Java Bean à un composant UI. Ce lien permet des mises à jour automatiques entre l'UI et le modèle backend. Chaque lien peut gérer la synchronisation des données, la validation, la transformation et la gestion des événements.

🗃️ Validation

5 articles

📄️ Transformation

Les transformations de données convertissent entre les types de données utilisés dans les composants UI et ceux de votre modèle de données. Cela permet de maintenir la compatibilité des types de données et un formatage approprié lors du transfert de données entre le frontend et le backend de vos applications.

📄️ Automatic Binding

webforJ offre plusieurs fonctionnalités qui simplifient le processus de configuration et de liaison automatique pour les développeurs. Cette section montre comment utiliser ces fonctionnalités de manière efficace.

Concept​

Key features​