In diesem Abschnitt wird erläutert, wie Sie das Bulk Editor-Tool entwickeln und die Produktlisten-Komponente erweitern, die auf dem Bulk Editor basiert.
Wenn Sie den Bulk Editor verwenden, können Sie einige Abfrageparameter zur URL hinzufügen, um den Bulk Editor mit einer bestimmten Konfiguration aufzurufen. Wenn Sie den Bulk Editor immer mit einer bestimmten Konfiguration nutzen möchten, beispielsweise in der Produktlisten-Komponente, müssen Sie die Datei bulkeditor.jsp (zu finden unter /libs/wcm/core/components/bulkeditor) ändern oder eine Komponente mit der spezifischen Konfiguration erstellen. Änderungen, die über Abfrageparameter erfolgen, sind nicht dauerhaft.
Wenn Sie zum Beispiel folgende URL in den Browser eingeben:
https://<servername><port_number>/etc/importers/bulkeditor.html?rootPath=/content/geometrixx/en&queryParams=geometrixx&initialSearch=true&hrp=true
wird der Bulk Editor ohne das Feld Stammverzeichnis angezeigt, da „hrp=true“ dieses Feld ausblendet. Mit dem Parameter „hrp=false“ (Standardwert) wird das Feld angezeigt.
Nachstehend finden Sie eine Liste der Abfrageparameter für den Bulk Editor:
Jeder Parameter kann einen langen und einen kurzen Namen haben. Der lange Name für die Suche nach dem Stammverzeichnis ist z. B. rootPath
, der kurze rp
. Wenn der lange Name nicht definiert ist, wird der kurze aus der Anfrage ausgelesen.
Parameter (Name/Kurzname) |
Typ |
Beschreibung |
rootPath / rp |
Zeichenfolge | Suchstammpfad |
queryParams / qp |
Zeichenfolge | abfrage suchen |
contentMode / cm |
Boolesch | Wenn "true", ist der Inhaltsmodus aktiviert |
colValue / cv |
Zeichenfolge[] | durchsuchte Eigenschaften (angekreuzte Werte aus "colsSelection"werden als Kontrollkästchen angezeigt) |
extraCols / ec |
Zeichenfolge[] | extra durchsuchte Eigenschaften (in einem kommagetrennten Textfeld angezeigt) |
initialSearch / is |
Boolesch | Wenn true, wird die Abfrage beim Laden der Seite ausgeführt |
colSelection / cs |
Zeichenfolge[] | Auswahl der gesuchten Eigenschaften (als Kontrollkästchen angezeigt) |
showGridOnly / sgo |
Boolesch | Wenn true, wird nur das Raster und nicht das Suchfeld angezeigt |
searchPanelCollapsed/spc | Boolesch | Wenn "true", wird das Suchfeld beim Laden reduziert |
hideRootPath / hrp | Boolesch | Wenn true, wird das Feld für den Stammpfad ausgeblendet |
hideQueryParams/hqp | Boolesch | Wenn "true", wird das Feld "Abfrage"ausgeblendet |
hideContentMode/hcm | Boolesch | Wenn "true", wird das Feld "Inhaltsmodus"ausgeblendet |
hideColsSelection / hcs | Boolesch | Wenn "true", wird das Auswahlfeld für Spalten ausgeblendet |
hideExtraCols / hec | Boolesch | Wenn true, wird das Feld für zusätzliche Spalten ausgeblendet |
hideSearchButton | Boolesch | Wenn true, wird die Suchschaltfläche ausgeblendet |
hideSaveButton/hsavep | Boolesch | Wenn "true", wird die Schaltfläche "Speichern"ausgeblendet |
hideExportButton/hexpb | Boolesch | Wenn "true", wird die Exportschaltfläche ausgeblendet |
hideImportButton/hib | Boolesch | Wenn "true", wird die Importschaltfläche ausgeblendet |
hideResultNumber / hrn | Boolesch | Wenn "true", wird der Text der Rastersuchergebnisnummer ausgeblendet |
hideInsertButton / hinsertb | Boolesch | Wenn "true", wird die Rastereinfügeschaltfläche ausgeblendet |
hideDeleteButton/hdelb | Boolesch | Wenn "true", wird die Schaltfläche zum Löschen des Rasters ausgeblendet |
hidePathCol/hpc | Boolesch | bei "true"wird die Rasterspalte "path"ausgeblendet |
In diesem Abschnitt finden Sie einen Überblick über die Verwendung des Bulk Editors und eine Beschreibung der vorhandenen Geometrixx-Komponente, die auf dem Bulk Editor basiert: der Produktlisten-Komponente.
Mit der Produktlisten-Komponente können Benutzer eine Tabelle mit Daten anzeigen und bearbeiten. Sie können beispielsweise mit der Produktlisten-Komponente Produkte in einem Katalog darstellen. Die Daten werden in einer standardmäßigen HTML-Tabelle angezeigt. Die Bearbeitung erfolgt über das Dialogfeld Bearbeiten, das ein Bulk Editor-Widget enthält. (Es handelt sich hierbei um denselben Bulk Editor, auf den Sie auch unter /etc/importers/bulkeditor.html oder über das Menü „Tools“ zugreifen können.) Die Produktlisten-Komponente wurde für eine spezifische, eingeschränkte Bulk Editor-Funktionalität konfiguriert. Alle Teile des Bulk Editors (oder Komponenten, die vom Bulk Editor abgeleitet werden) können konfiguriert werden.
Mit dem Bulk Editor können Sie Zeilen hinzufügen, ändern, löschen, filtern und exportieren, Änderungen speichern und einen Satz an Zeilen importieren. Jede Zeile wird als Knoten unter der Instanz der Produktlisten-Komponente gespeichert. Jede Zelle ist eine Eigenschaft eines jeden Knotens. Dies wurde bei der Entwicklung festgelegt und kann leicht geändert werden. Sie können Knoten beispielsweise auch an anderer Stelle im Repository speichern. Die Aufgabe des Abfrage-Servlets besteht darin, eine Liste der anzuzeigenden Knoten zurückzugeben; der Suchpfad ist als Produktliste-Instanz definiert.
Der Quellcode der Produktkomponenten-Liste ist im Repository unter /apps/geometrixx/components/productlist verfügbar und besteht aus mehreren Komponenten wie allen AEM:
Hier sehen Sie eine XML-Darstellung der untergeordneten Knoten des Dialogfelds:
<editor
jcr:primaryType="cq:Widget"
colsSelection="[ProductId,ProductName,Color,CatalogCode,SellingSku]"
colsValue="[ProductId,ProductName,Color,CatalogCode,SellingSku]"
contentMode="false"
exportURL="/etc/importers/bulkeditor/export.tsv"
extraCols="Selection"
hideColsSelection="false"
hideContentMode="true"
hideDeleteButton="false"
hideExportButton="false"
hideExtraCols="true"
hideImportButton="false"
hideInsertButton="false"
hideMoveButtons="false"
hidePathCol="true"
hideRootPath="true"
hideSaveButton="false"
hideSearchButton="false"
importURL="/etc/importers/bulkeditor/import"
initialSearch="true"
insertedResourceType="geometrixx/components/productlist/sku"
queryParams=""
queryURL="/etc/importers/bulkeditor/query.json"
saveURL="/etc/importers/bulkeditor/save"
xtype="bulkeditor">
<saveButton
jcr:primaryType="nt:unstructured"
text="Save modifications"/>
<searchButton
jcr:primaryType="nt:unstructured"
text="Apply filter"/>
<queryParamsInput
jcr:primaryType="nt:unstructured"
fieldDescription="Enter here your filters"
fieldLabel="Filters"/>
<searchPanel
jcr:primaryType="nt:unstructured"
height="200">
<defaults
jcr:primaryType="nt:unstructured"
labelWidth="150"/>
</searchPanel>
<grid
jcr:primaryType="nt:unstructured"
height="275"/>
<store jcr:primaryType="nt:unstructured">
<sortInfo
jcr:primaryType="nt:unstructured"
direction="ASC"
field="CatalogCode"/>
</store>
<colModel
jcr:primaryType="nt:unstructured"
width="150"/>
<colsMetadata jcr:primaryType="nt:unstructured">
<Selection
jcr:primaryType="nt:unstructured"
checkbox="true"
forcedPosition="0"
headerText=""/>
<ProductId
jcr:primaryType="nt:unstructured"
cellCls="productlist-cell-productid"
headerText="Product Id"/>
<ProductName
jcr:primaryType="nt:unstructured"
cellStyle="background-color: #FFCC99;"
headerText="Product Name"/>
<CatalogCode
jcr:primaryType="nt:unstructured"
cellStyle="background-color: #EDEDED;"
headerText="Catalog Code"/>
<Color jcr:primaryType="nt:unstructured">
<editor
jcr:primaryType="nt:unstructured"
store="[Blue,Red,Yellow]"
triggerAction="all"
typeAhead="true"
xtype="combo"/>
</Color>
<SellingSku
jcr:primaryType="nt:unstructured"
headerText="Sku Id"/>
</colsMetadata>
</editor>
Jeder Teil des Bulk Editors kann konfiguriert werden. In der folgenden Tabelle sind alle Konfigurationseigenschaften für den Bulk Editor aufgeführt.
Eigenschaftsname | Definition |
rootPath | Suchstammpfad |
queryParams | Suchanfrage |
contentMode | True, um den Inhaltsmodus zu aktivieren: Eigenschaften werden auf dem Knoten "jcr:content"und nicht auf dem Knoten "Suchergebnis"gelesen |
colsValue | Durchsuchte Eigenschaften (angekreuzte Werte aus "colSelection"werden als Kontrollkästchen angezeigt) |
extraCols | Extra durchsuchte Eigenschaften (in einem Textfeld mit Komma getrennt angezeigt) |
initialSearch | True für die Ausführung der Abfrage beim Laden der Seite |
colsSelection | Auswahl der gesuchten Eigenschaften (als Kontrollkästchen angezeigt) |
showGridOnly | True, um nur das Raster und nicht das Suchfeld anzuzeigen (vergessen Sie nicht, die initialSearch auf true festzulegen) |
searchPanelCollapsed | True to collapse search panel by default |
hideRootPath | Stammpfadfeld ausblenden |
hideQueryParams | Feld Abfrage ausblenden |
hideContentMode | Feld "Inhaltsmodus ausblenden" |
hideColsSelection | Auswahlfeld "Protokolle ausblenden" |
hideExtraCols | Feld "Zusatzprotokolle ausblenden" |
hideSearchButton | Schaltfläche "Suche ausblenden" |
hideSaveButton | Schaltfläche "Speichern"ausblenden |
hideExportButton | Schaltfläche "Export ausblenden" |
hideImportButton | Schaltfläche "Import ausblenden" |
hideResultNumber | Text der Rastersuchergebnisnummer ausblenden |
hideInsertButton | Schaltfläche zum Ausblenden des Rastereinfügens |
hideDeleteButton | Schaltfläche zum Löschen des Rasters ausblenden |
hidePathCol | Rasterspalte "Pfad"ausblenden |
queryURL | Pfad zum Abfrage-Servlet |
exportURL | Pfad zum Exportieren des Servlets |
importURL | Pfad zum Importieren des Servlets |
insertResourceType | Ressourcentyp zum Knoten hinzugefügt, wenn eine Zeile eingefügt wird |
saveButton | Schaltfläche speichern, Widget-Konfiguration |
searchButton | Widget-Konfiguration für Suchschaltflächen |
exportButton | Widget-Konfiguration für Schaltfläche exportieren |
importButton | Widget-Konfiguration für Schaltfläche importieren |
searchPanel | Widget-Konfiguration des Suchfelds |
grid | Widget-Konfiguration für Raster |
store | Store-Konfiguration |
colModel | Konfiguration des Rasterspaltenmodells |
rootPathInput | rootPath widget config |
queryParamsInput | queryParams-Widget config |
contentModeInput | contentMode-Widget-Konfiguration |
colsSelectionInput | colSelection-Widget-Konfiguration |
extraColsInput | extraCols widget config |
colMetadata | Konfiguration der Spaltenmetadaten. Mögliche Eigenschaften sind (auf alle Zellen der Spalte angewendet):
|
Sie können für jede Spalte Folgendes konfigurieren:
Anzeige-Eigenschaften: HTML-Stil, CSS-Klasse und Schreibschutz
ein Kontrollkästchen
eine erzwungene Position
CSS und schreibgeschützte Spalten
Der Bulk Editor verfügt über drei Spaltenkonfigurationen:
Die Konfiguration muss wie die folgende definiert werden:
"colsMetadata": {
"Column name": {
"cellStyle": "html style",
"cellCls": "CSS class",
"readOnly": true/false
}
}
Das folgende Beispiel findet sich in der Produktlisten-Komponente (/apps/geometrixx/components/productlist/dialog/items/editor/colsMetadata?lang=de):
<colsMetadata jcr:primaryType="nt:unstructured">
<Selection
jcr:primaryType="nt:unstructured"
checkbox="true"
forcedPosition="0"
headerText=""/>
<ProductId
jcr:primaryType="nt:unstructured"
cellCls="productlist-cell-productid"
headerText="Product Id"/>
<ProductName
jcr:primaryType="nt:unstructured"
cellStyle="background-color: #FFCC99;"
headerText="Product Name"/>
<CatalogCode
jcr:primaryType="nt:unstructured"
cellStyle="background-color: #EDEDED;"
headerText="Catalog Code"/>
<Color jcr:primaryType="nt:unstructured">
<editor
jcr:primaryType="nt:unstructured"
store="[Blue,Red,Yellow]"
triggerAction="all"
typeAhead="true"
xtype="combo"/>
</Color>
<SellingSku
jcr:primaryType="nt:unstructured"
headerText="Sku Id"/>
</colsMetadata>
Kontrollkästchen
Wenn die Konfigurationseigenschaft „Checkbox“ auf „true“ festgelegt ist, werden alle Zellen der Spalte als Kontrollkästchen gerendert. Ein aktiviertes Kontrollkästchen sendet true an das Servlet „Speichern“ des Servers, ein nicht aktiviertes sendet false. Im Header-Menü können Sie auch alle auswählen oder keines auswählen. Diese Optionen sind aktiviert, wenn der ausgewählte Header der Header einer Kontrollkästchenspalte ist.
Im vorhergehenden Beispiel enthält die Auswahlspalte nur Kontrollkästchen mit der Eigenschaft checkbox="true".
Erzwungene Position
Mit forcedPosition, den Metadaten für die erzwungene Position, können Sie festlegen, an welcher Stelle im Raster die Spalte platziert werden soll: 0 ist die erste Position und <Anzahl an Spalten> – 1 ist die letzte Position. Alle anderen Werte werden ignoriert.
Im vorhergehenden Beispiel ist die Auswahlspalte die erste Spalte mit forcedPosition = "0".
Standardmäßig befindet sich das Abfrage-Servlet unter /libs/wcm/core/components/bulkeditor/json.java
. Sie können einen anderen Pfad konfigurieren, um die Daten abzurufen.
Das Abfrage-Servlet funktioniert wie folgt: Es erhält eine GQL-Abfrage und die zurückzugebenden Spalten, berechnet die Ergebnisse und sendet sie als JSON-Stream zurück an den Bulk Editor.
Im Fall der Produktlisten-Komponente werden zwei Parameter wie folgt an das Abfrage-Servlet gesendet:
und der folgende JSON-Stream wird zurückgegeben:
{
"hits": [{
"jcr:path": "/content/geometrixx/en/products/jcr:content/par/productlist/1258674828905",
"ProductId": "21",
"ProductName": "Cube",
"Color": "Blue",
"CatalogCode": "43244",
"SellingSku": "32131"
}
],
"results": 1
}
Jeder Treffer entspricht einem Knoten und seinen Eigenschaften und wird als Zeile im Raster angezeigt.
Sie können das Abfrage-Servlet erweitern, sodass es ein komplexes Vererbungsmodell oder Knoten zurückgibt, die an einem bestimmten logischen Ort gespeichert sind. Mit dem Abfrage-Servlet können Sie alle Arten an komplexen Berechnungen durchführen. Das Raster kann daraufhin Zeilen anzeigen, die ein Aggregat mehrerer Knoten im Repository sind. Die Änderung und das Speichern dieser Zeilen werden in diesem Fall vom Speichern-Servlet verwaltet.
In der Standardkonfiguration des Bulk Editors ist jede Zeile ein Knoten und der Pfad dieses Knotens wird im Zeilendatensatz gespeichert. Der Bulk Editor behält die Verbindung zwischen der Zeile und dem Knoten über den JCR-Pfad bei. Wenn ein Benutzer das Raster bearbeitet, wird eine Liste aller Änderungen erstellt. Klickt ein Benutzer auf Speichern, wird eine POST-Abfrage mit den aktualisierten Eigenschaftswerten an jeden Pfad gesendet. Dies ist die Grundlage des Sling-Konzepts. Es funktioniert problemlos, wenn jede Zelle eine Eigenschaft des Knotens ist. Wenn das Abfrage-Servlet dagegen zur Berechnung von Vererbungen implementiert wurde, kann dieses Modell nicht funktionieren, da eine vom Abfrage-Servlet zurückgegebene Eigenschaft von einem anderen Knoten geerbt werden kann.
Beim Speichern-Servlet werden die Änderungen nicht direkt an jeden Knoten übermittelt, sondern an ein Servlet, das die Aufgabe des Speicherns übernimmt. Auf diese Weise kann dieses Servlet die Änderungen analysieren und die Eigenschaften auf dem richtigen Knoten speichern.
Jede aktualisierte Eigenschaft wird im folgenden Format an das Servlet gesendet:
Parametername: <jcr path>/<property name>
Beispiel: /content/geometrixx/de/products/jcr:content/par/productlist/1258674859000/SellingSku
Wert: <value>
Beispiel: 12123
Das Servlet muss wissen, wo die Eigenschaft catalogCode gespeichert ist.
Eine standardmäßige Save-Servlet-Implementierung ist unter /libs/wcm/bulkeditor/save/POST.jsp verfügbar und wird in der Produktkomponente verwendet. Es nimmt alle Parameter aus der Anforderung (mit dem Format <jcr path>/<property name>) und schreibt Eigenschaften mithilfe der JCR-API auf Knoten. Außerdem erstellt das Servlet Knoten, wenn sie nicht vorhanden sind (in das Raster eingefügte Zeilen).
Der Standardcode sollte nicht so verwendet werden, wie er es nativ implementiert (eine POST auf <jcr path>/<property name>), und ist daher nur ein guter Ausgangspunkt zum Erstellen eines Save-Servlets, das ein Eigenschaftsvererbungsmodell verwaltet.