Die XdevFieldGroup ist eine virtuelle GUI-Komponente (Virtual Component), die zu einem gemeinsamen Formular gehörende Formular-Komponenten mit dem dazugehörigen Entity, bzw. mit dessen Attributen verbindet (Mapping). Durch das Mapping zwischen Formular und Entity lassen sich Formular-Daten auf einfache Weise in das Formular übertragen und diese mit jeweils nur einem einzigen Methodenaufruf speichern und editieren. Die Formular-Komponenten können sich an völlig beliebigen Positionen befinden und müssen weder gruppiert, noch sich in einem gemeinsamen Parent-Container befinden. 

Formular generieren lassen

1. Legen Sie eine neue View CategoryForm ohne Layout an.
2. Fügen Sie das Entity Category per Drag-and-Drop in die View ein.
3. Klicken Sie im folgenden Formular-Assistenten auf OK.
   Image Removed

Hinweis:

...

The XdevFieldGroup is a virtual GUI component (Virtual Component) that connects the form components with the associated entity or with its attributes (mapping). Through mapping between form and entity, form data can be easily transferred in the form. This data can be saved and edited with a single method call. These form components can be located in any position and don’t have to be grouped or placed in a shared parent container.

Generating Forms

1. Create a new View CategoryForm  without layout.
2. Add the Category entity to the view via drag and drop.
3. In the following form wizard click OK.
   Image Added

Note:

• Data sources used - Data Source: H2 Northwind > Entity: Category

...

Result:

• Im In the GUI-Builder
  
• Mapping - Mapping zwischen Formular-Komponenten und den Attributen des Entity Category bei der XdevFieldGroup > Properties >   Map between form components and Category entity attributes in XdevFieldGroup > Properties > Field mapping.
  
• Generierte Formular-AktionenGenerated Form Actions

  • New - Erzeugt einen neuen, leeren Datensatz im Speicher  Generates new, empty record in the memory.

    Code Block
    language java theme Confluence
    this.fieldGroup.setItemDataSource(new Category());

  • Reset - Setzt alle Formular-Komponenten zurück Resets all form components.

    Code Block
    language java theme Confluence
    this.fieldGroup.discard();

  • Save - Speichert den Datensatz in der Datenbank ab  Saves the record in the database.

    Code Block
    language java theme Confluence
    this.fieldGroup.save();

  • Save + new - Speichert den Datensatz in der Datenbank ab und erzeugt einen neuen, leeren Datensatz im Speicher  Saves the record in the database and generates a new, empty record in the memory.

    Code Block
    language java theme Confluence
    this.fieldGroup.save(); this.fieldGroup.setItemDataSource(new Category());

Weitere Formular-Aktionen

...

Further Form Actions

• Create empty product object and pass it to XdevFieldGroup, e.g. to create a new record:

  Code Block
  language java theme Confluence
  Products product = new Products(); fieldGroup.setItemDataSource(product);

• Datensatz mit der ID 5 laden und an die XdevFieldGroup übergebenLoad record with ID 5 and pass to XdevFieldGroup::

  Code Block
  language java theme Confluence
  Category category = new CategoryDAO().find(5); fieldGroup.setItemDataSource(category);

• Selektierte Zeile einer XdevTable an die XdevFieldGroup übergeben (ohne die GUI-Builder Unterstützung bei Property > Connected form zu verwenden). Dafür müssen Sie bei der XdevTable das Event valueChange anlegenTransmit the selected line of an XdevFieldGroup (without support of GUI builder) in Property > Connected form. To achieve this, you will need to create the value change event in XdevTable.

  Code Block
  language java theme Confluence
  BeanItem<Category> item = table.getSelectedItem(); fieldGroup.setItemDataSource(item);

Formular manuell erstellen 

...

Creating forms manually

1. Create a new View CategoryForm  without layout.
2. Create a form for the Category entity.
   
   1. Add an XdevFormLayout.
   2. Add three XdevTextFields one below the other.
   3. Rename the XdevTextFields in Properties > Name as txtCategoryname, txtDescription, and txtPicture.
   4. Under Properties > Caption select the labels Categoryname, Description, Picture festfor the XdevTextFields.
3. Fügen Sie eine XdevFieldGroup an einer beliebigen Stelle ein.
4. Klicken Sie bei Structure > Add an XdevFieldGroup anywhere.
5. Click Structure > fieldGroup.
   
6. Verknüpfen Sie die Formular-Komponenten mit den entsprechend geeigneten Attributen des Entity CategoryConnect the form components using the corresponding attributes of the Category entity.
   
   1. Klicken Sie in den Properties > Type > ... .
   2. Geben Sie im folgenden Dialog in das Suchfeld Categories ein und wählen Sie das Entity Category aus.
      
   3. Klicken Sie auf OK.
   4. Klicken Sie in den Properties > Field mapping > Entries.
   5. Klicken Sie im folgenden Dialog auf New, klicken Sie in die Spalte Field und wählen Sie txtCategoryname aus und wählen Sie in der Spalte Property > categoryname aus.
   6. Klicken Sie im folgenden Dialog auf New, klicken Sie in die Spalte Field und wählen Sie txtDescription aus und wählen Sie in der Spalte Property > description aus.
   7. Klicken Sie im folgenden Dialog auf New, klicken Sie in die Spalte Field und wählen Sie txtPicture aus und wählen Sie in der Spalte Property > picture aus.
   8. Klicken Sie auf OK.
      
      
      

Hinweis:

• Verwendete Datenquelle - Data Source: H2 Northwind > Entity: Category

Ergebnis:

• Im GUI-Builder
  

Formular ohne FieldGroup erstellen

1. Legen Sie eine neue View CategoryForm ohne Layout an.
2. Erstellen Sie ein Formular für das Entity Category.
   1. Fügen Sie ein XdevFormLayout ein.
   2. Fügen Sie 3 XdevTextFields untereinander ein.
   3. Benennen Sie die XdevTextFields in den Properties > Name um in txtCategoryname, txtDescription, txtPicture.
   4. Legen Sie für die XdevTextFields in den Properties > Caption die Beschriftungen Categoryname, Description, Picture fest.
3. Fügen Sie einen XdevButton in das XdevFormLayout ein und legen Sie in den Properties > Caption die Beschriftung Save fest.
4. Fügen Sie Event buttonClick hinzu.

5. Fügen Sie in das buttonClick Event den Code zum Auslesen der Formular-Komponenten ein. 

   Code Block
   language java theme Confluence
   Category category = new Category(); // Readout the textFields and filling the entity category.setCategoryname(this.textField.getValue()); category.setDescription(this.textField2.getValue()); category.setPicture(this.textField3.getValue()); // Saving the entity try { new CategoryDAO().save(category); } catch (Exception e) { // TODO: handle exception }

Hinweis:

• Verwendete Datenquelle - Data Source: H2 Northwind > Entity: Category 

Ergebnis:

• Im GUI-Builder
  

List of all form components

...