Startseite / Tutorials / Das erste Projekt / Datenbanken verwenden / Tabellenvorlagen editieren / Formular für Produkte

Eingabekomponenten für die Tabelle Produkte definieren

 

Um die Eingabekomponenten zu definieren, wird der Quellcode innerhalb der <CMS_MODULE>-Tags eingefügt. Der Quellcode und die zugehörigen Erläuterungen für die in der Tabelle Produkte verwendeten Tabellenspalten

sind in den folgenden Abschnitten beschrieben.

Text-Eingabekomponente für den Produktnamen

Der Quellcode einer einzeiligen Text-Eingabekomponente für den Produktnamen soll in unserem Beispiel lauten:

<CMS_INPUT_TEXT name="cs_name" hFill="yes" singleLine="no" useLanguages="yes">
<LANGINFOS>
<LANGINFO lang="*" label="Product name" description="Insert the product name."/>
<LANGINFO lang="DE" label="Produktname" description="Tragen Sie den Produktnamen ein."/>
</LANGINFOS>
</CMS_INPUT_TEXT>

Durch einen Klick auf das Speichern-Icon in der Symbolleiste wird das Aussehen der Eingabekomponente direkt in der Integrierten Vorschau angezeigt.

  

CMS_INPUT_TEXT

Aufruf der Eingabekomponente für einzeilige Texteingaben

name="cs_name"

Eindeutiger Name der Eingabekomponente. Unter diesem Namen kann später auf die in der Komponente gespeicherten Inhalte zugegriffen werden.

hFill="yes"

Die Anzeige einer Eingabekomponente erfolgt in der vollen zur Verfügung stehenden Anzeigebreite.

singleLine="no"

Die Eingabekomponente soll zweizeilig mit Rahmen dargestellt werden.

useLanguages="yes"

Es werden abweichende Werte für die verschiedenen Sprachen gespeichert.

LANGINFO lang="*"
LANGINFO lang="DE"

Gibt die Sprachinformationen für

  • * = alle nicht explizit definierten Sprachen
  • DE = die Sprache DE

an.

label="Produktname"

Beschriftung der Eingabekomponente in der Inhalte- oder Datenquellen-Verwaltung für die angegebene Sprache.

description="Tragen Sie den Produktnamen ein"

Eine Beschreibung, die zur Anzeige eines Tooltips (Mouse-Over) genutzt wird.

  

DOM-Editor für die Produkt-Beschreibung

Für die Produkt-Beschreibung wird die Eingabekomponente CMS_INPUT_DOM verwendet. Der Quellcode einer DOM-Eingabekomponente für Produkt-Beschreibung lautet:

<CMS_INPUT_DOM name="cs_description" hFill="yes" rows="10" useLanguages="yes">
<FORMATS>
<TEMPLATE name="p"/>
</FORMATS>
<LANGINFOS>
<LANGINFO lang="*" label="Product description" description="Insert a product description."/>
<LANGINFO lang="DE" label="Produktbeschreibung" description="Fügen Sie eine Produktbeschreibung hinzu."/>
</LANGINFOS>
</CMS_INPUT_DOM>

Durch einen Klick auf das Speichern-Icon in der Symbolleiste wird das Aussehen der Eingabekomponente für die Produktbeschreibung direkt in der Integrierten Vorschau angezeigt.

  

CMS_INPUT_DOM

Aufruf der Eingabekomponente DOM-Editor für größere formatierte Texteingaben.

name="cs_description"

Eindeutiger Name der Eingabekomponente. Unter diesem Namen kann später auf die Komponente zugegriffen werden.

hFill="yes"

Die Anzeige einer Eingabekomponente erfolgt in der vollen zur Verfügung stehenden Anzeigebreite.

rows="10"

Legt die Höhe der Eingabekomponente auf 10 Zeilen fest.

useLanguages="yes"

Es werden abweichende Werte für die verschiedenen Sprachen gespeichert.

FORMATS

Innerhalb dieses Tags wird die Menge der verwendbaren Formatvorlagen festgelegt.

TEMPLATE name="p"

Definiert genau eine Formatvorlage, die im Editor verwendet werden kann. name="p" gibt dabei den Referenznamen der verwendbaren Vorlage an.

LANGINFO lang="*"
LANGINFO lang="DE"

Gibt die Sprachinformationen für

  • * = alle nicht explizit definierten Sprachen
  • DE = die Sprache DE

an.

label="Produktbeschreibung"

Beschriftung der Eingabekomponente in der Datenquellen-Verwaltung.

description="Fügen Sie eine Produkt..."

Eine Beschreibung, die zur Anzeige eines Tooltips (Mouse-Over) genutzt wird.

  

Referenz für das Produktbild

Für das Produktbild wird die Eingabekomponente FS_REFERENCE verwendet. Der Quellcode für eine Bild-Referenz lautet:

<FS_REFERENCE name="cs_picture" hFill="yes" imagePreview="yes" upload="yes" useLanguages="no">
<FILTER>
<ALLOW type="picture"/>
<HIDE type="file"/>
</FILTER>
<LANGINFOS>
<LANGINFO lang="*" label="Picture" description="Choose a picture."/>
<LANGINFO lang="DE" label="Bildauswahl" description="Wählen Sie hier ein Bild aus."/>
</LANGINFOS>
<PROJECTS>
<LOCAL name=".">
<SOURCES>
<FOLDER name="root" store="mediastore"/>
</SOURCES>
</LOCAL>
</PROJECTS>
</FS_REFERENCE>

Durch einen Klick auf das Speichern-Icon in der Symbolleiste wird das Aussehen der Eingabekomponente für die Bildreferenz ebenfalls direkt in der Integrierten Vorschau angezeigt.

  

FS_REFERENCE

Aufruf der Eingabekomponente FS_REFERENCE zur Aufnahme einer beliebigen Referenz.

name="cs_picture"

Eindeutiger Name der Eingabekomponente. Unter diesem Namen kann später auf die Komponente zugegriffen werden.

hFill="yes"

Die Anzeige einer Eingabekomponente erfolgt in der vollen zur Verfügung stehenden Anzeigebreite.

imagePreview="yes"

Eine Bildvorschau des ausgewählten Bildes wird zugelassen.

upload="yes"

Erlaubt es dem Redakteur, ein Medium über die Eingabekomponente hochzuladen.

useLanguages="no"

Es wird ein Wert für alle Sprachen gespeichert.

LANGINFO lang="*"
LANGINFO lang="DE"

Gibt die Sprachinformationen für

  • * = alle nicht explizit definierten Sprachen
  • DE = die Sprache DE

an.

label="Bildauswahl"

Beschriftung der Eingabekomponente in der Inhalte- oder Datenquellen-Verwaltung.

description="Bitte wählen Sie..."

Eine Beschreibung, die zur Anzeige eines Tooltips (Mouse-Over) genutzt wird.

PROJECTS

Über dieses Tag kann definiert werden, aus welchen Projekten (lokal und/oder remote) Referenzen ausgewählt werden dürfen.

LOCAL name="."

Über das Tag LOCAL wird das aktuelle Projekt angegeben.

SOURCES

Mit dem Tag SOURCES wird die Auswahl der Bild-Referenzen eingeschränkt. Für jeden zugelassenen Ordner ist ein FOLDER-Tag anzugeben.

FOLDER name="root" store="mediastore"

Es soll die gesamte Medien-Verwaltung ab der Wurzel-Ebene auswählbar sein.

  

Dataset für die Verbindung zur Tabelle Produkt-Kategorien

Für die Verbindung zu der Tabelle Produkt-Kategorie wird die Eingabekomponente FS_DATASET verwendet. Der Quellcode lautet:

<FS_DATASET  name="cs_categories" allowDelete="no" allowEdit="no" allowNew="no" 
hFill="yes" height="475" useLanguages="no">
<LANGINFOS>
<LANGINFO
lang="*" label="Product-Categories" description="Choose the Product-Categorie."
expression="if(!#item.isEmpty, &quot;[X]&quot;)"/>
<LANGINFO
lang="DE" label="Produkt-Kategorie" description="Wählen Sie die Produkt-Kategorie aus."
expression="if(!#item.isEmpty, &quot;[X]&quot;)"/>
</LANGINFOS>
<SOURCES>
<CONTENT name="produkt_kategorien"/>
</SOURCES>
</FS_DATASET>
Wichtig Der SOURCES-Tag kann erst definiert werden, wenn die Datenquelle "Produkt-Kategorien" in der Datenquellen-Verwaltung hinzugefügt wurde (siehe Datensatzbearbeitung). Dadurch wird die Auswahl auf eine Datenquelle eingeschränkt.

Durch einen Klick auf das Speichern-Icon in der Symbolleiste wird das Aussehen der Eingabekomponente direkt in der Integrierten Vorschau angezeigt.

  

FS_DATASET

Aufruf der Eingabekomponente zur Datensatzauswahl

name="cs_categories"

Eindeutiger Name der Eingabekomponente. Unter diesem Namen kann später auf die in der Komponente gespeicherten Inhalte zugegriffen werden.

allowDelete="no"

Ein Datensatz kann nicht direkt über die Eingabekomponente gelöscht werden

allowEdit="no"

Das Bearbeiten von Einträgen ist nicht möglich.

allowNew="no"

Es können keine neue Einträge angelegt werden.

hFill="yes"

Die Anzeige einer Eingabekomponente erfolgt in der vollen zur Verfügung stehenden Anzeigebreite.

height="475"

 

useLanguages="no"

Es wird ein Wert für alle Sprachen gespeichert.

LANGINFO lang="DE"

Gibt die Sprachinformationen für die Sprache DE an.

label="Produkt-Kategorie"

Beschriftung der Eingabekomponente in der Inhalte- oder Datenquellen-Verwaltung für die angegebene Sprache.

description="Wählen Sie die Produkt-Kategorie aus."

Eine Beschreibung, die zur Anzeige eines Tooltips (Mouse-Over) genutzt wird.

expression="if(!#item.isEmpty, &quot;[X]&quot;)"/>

Über expression kann auf den Inhalt der Spalten einer Tabelle zugegriffen werden, die über einen Fremdschlüssel mit der Datenquelle verbunden ist.
Das Systemobjekt #item repräsentiert den jeweiligen in der Eingabekomponente ausgewählten Datensatz.

SOURCES

Mit dem Tag SOURCES ist es möglich, die Auswahl oder Anzeige auf Datenquellen der Datenquellen-Verwaltung einzuschränken.
Um eine Datenquelle zuzulassen, ist jeweils ein CONTENT-Tag anzugeben.

<CONTENT name="produkt_kategorien"/>

Soll FS_DATASET auf eine Fremdschlüsselbeziehung abgebildet ("gemappt") werden, darf ausschließlich ein CONTENT-Tag angegeben werden.
Zugelassen wird die Datenquelle mit dem Namen "produkt_kategorien".

  

Gesamter Formularbereich der Tabellenvorlage Produkte

<CMS_MODULE>

<CMS_INPUT_TEXT name="cs_name" hFill="yes" singleLine="no" useLanguages="yes">
<LANGINFOS>
<LANGINFO lang="*" label="Product name" description="Insert the product name."/>
<LANGINFO lang="DE" label="Produktname" description="Tragen Sie den Produktnamen ein."/>
</LANGINFOS>
</CMS_INPUT_TEXT>

<CMS_INPUT_DOM name="cs_description" hFill="yes" rows="10" useLanguages="yes">
<FORMATS>
<TEMPLATE name="p"/>
</FORMATS>
<LANGINFOS>
<LANGINFO lang="*" label="Product description" description="Insert a product description."/>
<LANGINFO lang="DE" label="Produktbeschreibung" description="Fügen Sie eine Produktbeschreibung hinzu."/>
</LANGINFOS>
</CMS_INPUT_DOM>

<FS_REFERENCE name="cs_picture" hFill="yes" imagePreview="yes" upload="yes" useLanguages="no">
<FILTER>
<ALLOW type="picture"/>
<HIDE type="file"/>
</FILTER>
<LANGINFOS>
<LANGINFO lang="*" label="Picture" description="Choose a picture."/>
<LANGINFO lang="DE" label="Bildauswahl" description="Wählen Sie hier ein Bild aus."/>
</LANGINFOS>
<PROJECTS>
<LOCAL name=".">
<SOURCES>
<FOLDER name="root" store="mediastore"/>
</SOURCES>
</LOCAL>
</PROJECTS>
</FS_REFERENCE>

<FS_DATASET name="cs_categories" allowDelete="no" allowEdit="no" allowNew="no"
hFill="yes" height="475" useLanguages="no">
<LANGINFOS>
<LANGINFO
lang="*" label="Product-Categories" description="Choose the Product-Categorie."
expression="if(!#item.isEmpty, &quot;[X]&quot;)"/>
<LANGINFO
lang="DE" label="Produkt-Kategorie" description="Wählen Sie die Produkt-Kategorie aus."
expression="if(!#item.isEmpty, &quot;[X]&quot;)"/>
</LANGINFOS>
<SOURCES>
<CONTENT name="produkt_kategorien"/>
</SOURCES>
</FS_DATASET>

</CMS_MODULE>

© 2005 - 2024 Crownpeak Technology GmbH | Alle Rechte vorbehalten. | FirstSpirit 2024.5 | Datenschutz