Developing the Bulk Editor
- Ämnen:
- Developing
Skapat för:
- Developer
I det här avsnittet beskrivs hur du utvecklar ett gruppredigeringsverktyg och hur du utökar produktlistekomponenten, som baseras på gruppredigeraren.
Frågeparametrar för gruppredigerare
När du arbetar med massredigeraren finns det flera frågeparametrar som du kan lägga till i URL:en för att anropa massredigeraren med en viss konfiguration. Om du vill att bulkredigeraren alltid ska användas med en viss konfiguration, till exempel som i produktlistekomponenten, måste du ändra bulkeditor.jsp (som finns i /libs/wcm/core/components/bulkeditor) eller skapa en komponent med den specifika konfigurationen. Ändringar som görs med frågeparametrar är inte permanenta.
Om du till exempel skriver in följande i webbläsarens URL:
https://<servername><port_number>/etc/importers/bulkeditor.html?rootPath=/content/geometrixx/en&queryParams=geometrixx&initialSearch=true&hrp=true
massredigeraren visas utan Rotsökväg fältet as hrp=true döljs. Med parametern hrp=false visas fältet (standardvärdet).
Här följer en lista med frågeparametrar för massredigering:
rootPath
, den korta är rp
. Om det långa namnet inte är definierat läses det korta av begäran.
Parameter (långt namn/kort namn) | Typ | Beskrivning |
rootPath / rp | Sträng | sökrotsökväg |
queryParams / qp | Sträng | sökfråga |
contentMode / cm | Boolean | när true är innehållsläget aktiverat |
colValue / cv | Sträng[] | sökta egenskaper (markerade värden från colSelection visas som kryssrutor) |
extraCols / ec | Sträng[] | extra sökta egenskaper (visas i ett kommaseparerat textfält) |
initialSearch / is | Boolean | om true utförs frågan vid sidinläsning |
minutesSelection / cs | Sträng[] | sökbar egenskapsmarkering (visas som kryssrutor) |
showGridOnly / go | Boolean | om true visas endast stödrastret och inte sökpanelen |
searchPanelCollapsed/spc | Boolean | när true är sökpanelen komprimerad vid inläsning |
hideRootPath / hrp | Boolean | om true döljs rotsökvägsfältet |
hideQueryParams / hqp | Boolean | om true döljs frågefältet |
hideContentMode / hcm | Boolean | när true döljs fältet för innehållsläge |
hideColsSelection / hcs | Boolean | om true döljs kolumnmarkeringsfältet |
hideExtraCols / hec | Boolean | om true döljs fältet för extra kolumner |
hideSearchButton | Boolean | om true döljs sökknappen |
hideSaveButton / hsavep | Boolean | om true döljs knappen Spara |
hideExportButton / hexpb | Boolean | när true döljs exportknappen |
hideImportButton / hib | Boolean | om true döljs importknappen |
hideResultNumber / hrn | Boolean | om true döljs texten för stödrastrets sökresultatnummer |
hideInsertButton / hinsertb | Boolean | om true döljs infogningsknappen för stödrastret |
hideDeleteButton / hdelb | Boolean | om true döljs knappen för att ta bort stödraster |
hidePathCol / hpc | Boolean | om true döljs stödrastrets "sökvägskolumn" |
Utveckla en gruppredigeringsbaserad komponent: produktlistkomponenten
I det här avsnittet finns en översikt över hur du använder gruppredigeraren och en beskrivning av den befintliga Geometrixx baserat på gruppredigeraren: komponenten Produktlista.
Med komponenten Produktlista kan användare visa och redigera en datatabell. Du kan till exempel använda komponenten Produktlista för att representera produkter i en katalog. Informationen visas i en HTML-tabell och redigering utförs i Redigera som innehåller en BulkEditor-widget. (Den här gruppredigeraren är exakt densamma som den som finns på /etc/importers/bulkeditor.html eller via Verktyg-menyn). Produktlistkomponenten har konfigurerats för specifika, begränsade massredigeringsfunktioner. Alla delar av gruppredigeraren (eller komponenter som härletts från gruppredigeraren) kan konfigureras.
Med gruppredigeraren kan du lägga till, ändra, ta bort, filtrera och exportera raderna, spara ändringar och importera en uppsättning rader. Varje rad lagras som en nod under själva produktlistkomponentinstansen. Varje cell är en egenskap för varje nod. Det här är ett designalternativ och kan enkelt ändras. Du kan till exempel lagra noder någon annanstans i databasen. Frågeserverns roll är att returnera listan över noder som ska visas. sökvägen definieras som en produktlistinstans.
Källkoden för produktlistkomponenten finns i databasen i /apps/geometrixx/components/productlist och består av flera delar, som alla AEM:
- HTML: återgivningen görs i en JSP-fil (https://experienceleague.adobe.com/apps/geometrixx/components/productlist/productlist.jsp?lang=sv). JSP läser delnoderna för den aktuella produktlistkomponenten och visar var och en av dem som en rad i en HTML-tabell.
- Dialogrutan Redigera, där du definierar konfigurationen för gruppredigeraren. Konfigurera dialogrutan så att den matchar komponentens behov: tillgängliga kolumner och möjliga åtgärder som utförs i rutnätet eller i sökningen. Se konfigurationsegenskaper för massredigering om du vill ha information om alla konfigurationsegenskaper.
Här är en XML-representation av delnoderna i dialogrutan:
<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>
Konfigurationsegenskaper för gruppredigeraren
Alla delar av gruppredigeraren kan konfigureras. I följande tabell visas alla konfigurationsegenskaper för massredigeraren.
Egenskapsnamn | Definition |
rootPath | Sökrotsökväg |
queryParams | Sökfråga |
contentMode | True to enable content mode: egenskaper läses på jcr:innehållsnod och inte på sökresultatnod |
colValue | Sökda egenskaper (markerade värden från colSelection visas som kryssrutor) |
extraCols | Extra sökta egenskaper (visas med kommaavgränsade textfält) |
initialSearch | True to perform query on page load |
ProtokollMarkering | Markering av sökta egenskaper (visas som kryssrutor) |
showGridOnly | True to show only the grid and not the search panel (glöm inte att ställa in initialSearch på true) |
searchPanelCollapsed | Sant att komprimera sökpanelen som standard |
hideRootPath | Dölj rotsökvägsfält |
hideQueryParams | Dölj frågefält |
hideContentMode | Dölj fältet för innehållsläge |
hideColsSelection | Dölj fältet för val av protokoll |
hideExtraCols | Dölj extra protokollfält |
hideSearchButton | Dölj sökknapp |
hideSaveButton | Dölj knappen Spara |
hideExportButton | Dölj exportknapp |
hideImportButton | Dölj importknapp |
hideResultNumber | Dölj text för sökresultat för stödraster |
hideInsertButton | Dölj infogningsknapp för stödraster |
hideDeleteButton | Knappen Ta bort stödraster |
hidePathCol | Dölj kolumnen "bana" för stödraster |
queryURL | Sökväg till frågeservice |
exportURL | Sökväg till exportserver |
importURL | Sökväg till importservlet |
insertResourceType | Resurstypen läggs till i noden när en rad infogas |
saveButton | Spara konfiguration för knappwidget |
searchButton | Widget-konfiguration för sökknapp |
exportButton | Konfigurera knappwidget |
importButton | Konfigurera knappwidget |
searchPanel | Widgetkonfiguration för sökpanel |
rutnät | Konfiguration för stödrasterwidget |
store | Butikskonfiguration |
colModel | Modellkonfiguration för stödrasterkolumn |
rootPathInput | rootPath widget config |
queryParamsInput | queryParams widget config |
contentModeInput | contentMode widget config |
colSelectionInput | formsSelection widget config |
extraColsInput | extraCols widget, konfiguration |
ProtokollMetadata |
Konfiguration av kolumnmetadata. Möjliga egenskaper används (används på alla celler i kolumnen):
|
Metadatakonfiguration för kolumner
Du kan konfigurera för varje kolumn:
-
visningsegenskaper: html-format, CSS-klass och skrivskyddad
-
en kryssruta
-
en fast position
CSS och skrivskyddade kolumner
Massredigeraren har tre kolumnkonfigurationer:
- Cell-CSS-klassnamn (cellCls): ett CSS-klassnamn som läggs till i varje cell i den konfigurerade kolumnen.
- Cellformat (cellStyle): ett HTML-format som läggs till i varje cell i den konfigurerade kolumnen.
- Skrivskyddad (readOnly): skrivskyddat anges för varje cell i den konfigurerade kolumnen.
Konfigurationen måste definieras som följande:
"colsMetadata": {
"Column name": {
"cellStyle": "html style",
"cellCls": "CSS class",
"readOnly": true/false
}
}
Följande exempel finns i produktlistekomponenten (https://experienceleague.adobe.com/apps/geometrixx/components/productlist/dialog/items/editor/colMetadata?lang=sv):
<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>
Kryssruta
Om konfigurationsegenskapen för kryssrutan är true återges alla celler i kolumnen som kryssrutor. En kryssruta skickar true till serverns Spara-server, false i annat fall. På rubrikmenyn kan du även markera alla eller välj ingen. De här alternativen aktiveras om den valda rubriken är rubriken för en kryssrutekolumn.
I det tidigare exemplet innehåller markeringskolumnen bara kryssrutor som checkbox="true".
Tvingad position
Med metadata för forcerad position i forcePosition kan du ange var kolumnen ska placeras i rutnätet: 0 är första plats och <number of="" columns="">-1 är den sista positionen. Alla andra värden ignoreras.
I det tidigare exemplet är markeringskolumnen den första kolumnen som forcerad position="0".
Frågeservlet
Som standard finns frågeservern på /libs/wcm/core/components/bulkeditor/json.java
. Du kan konfigurera en annan sökväg för att hämta data.
Frågeservern fungerar så här: tar emot en GQL-fråga och de kolumner som ska returneras, beräknar resultaten och skickar tillbaka resultaten till massredigeraren som en JSON-ström.
I produktlistekomponenterna är de två parametrar som skickas till frågeservern följande:
- fråga: "path:/content/geometrixx/en/customers/jcr:content/par/productlist Cube"
- Protokoll: "Markering,ProductId,ProductName,Color,CatalogCode,SellingSku"
och den returnerade JSON-strömmen är följande:
{
"hits": [{
"jcr:path": "/content/geometrixx/en/products/jcr:content/par/productlist/1258674828905",
"ProductId": "21",
"ProductName": "Cube",
"Color": "Blue",
"CatalogCode": "43244",
"SellingSku": "32131"
}
],
"results": 1
}
Varje träff motsvarar en nod och dess egenskaper, och visas som en rad i rutnätet.
Du kan utöka frågeservern för att returnera en komplex arvsmodell eller returnera noder som lagras på en viss logisk plats. Frågeservern kan användas för alla typer av komplex beräkning. Rutnätet kan sedan visa rader som är en sammanställning av flera noder i databasen. Ändringen och sparandet av dessa rader måste i så fall hanteras av Spara server.
Spara server
I standardkonfigurationen för gruppredigeraren är varje rad en nod och sökvägen för den här noden lagras i radposten. Massredigeraren behåller länken mellan raden och noden genom jcr-sökvägen. När en användare redigerar stödrastret skapas en lista över alla ändringar. När en användare klickar Spara skickas en POST till varje sökväg med de uppdaterade egenskapsvärdena. Detta är grunden för Sling-konceptet och fungerar bra om varje cell är en nodegenskap. Men om frågeservern implementeras för arvsberäkning kan modellen inte fungera som en egenskap som returneras av frågeservern kan ärvas från en annan nod.
Konceptet Spara serverlet är att ändringarna inte publiceras direkt till varje nod, utan att de bokförs på en server som utför sparandet. Detta ger den här servern möjlighet att analysera ändringarna och spara egenskaperna på rätt nod.
Varje uppdaterad egenskap skickas till servern i följande format:
-
Parameternamn: <jcr path="">/<property name="">
Exempel: /content/geometrixx/en/products/jcr:content/par/productlist/1258674859000/SellingSku
-
Värde: <value>
Exempel: 12123
Servern behöver veta var egenskapen catalogCode lagras.
En standardserverimplementering för Spara finns på /libs/wcm/bulkeditor/save/POST.jsp och används i produktlistkomponenten. Den tar alla parametrar från begäran (med en <jcr path="">/<property name=""> format) och skriver egenskaper på noder med JCR-API:t. Noden skapas också om den inte finns (rutnätsinfogade rader).
Standardkoden ska inte användas som den är eftersom den återimplementerar det som servern gör internt (en POST på <jcr path="">/<property name="">) och är därför bara en bra utgångspunkt för att skapa en Spara-server som hanterar en egenskapsarvsmodell.
Experience Manager
- Utveckla användarhandboken - översikt
- Introduktion för utvecklare
- Komma igång med utveckling i AEM Sites – WKND-självstudiekurs
- AEM kärnbegrepp
- Struktur för det AEM användargränssnittet med pekskärm
- Koncepten i det AEM användargränssnittet med pekskärm
- AEM - riktlinjer och bästa praxis
- Använda bibliotek på klientsidan
- Developing and Page Diff
- Begränsningar för redigerare
- CSRF Protection Framework
- Datamodellering - David Nueschelers modell
- Bidrar till AEM
- Dokumentskydd
- Referensmaterial
- Skapa en webbplats med alla funktioner (Classic UI)
- Designer och Designer (Classic UI)
- Plattform
- Fusklapp för Sling
- Använda Sling-adaptrar
- Taggbibliotek
- Mallar
- Använda Sling Resource Merger i AEM
- Övertäckningar
- Namnkonventioner
- Skapa en ny GRE-fältkomponent
- Query Builder
- Taggar
- Anpassa sidor som visas av felhanteraren
- Anpassade nodtyper
- Lägga till teckensnitt för grafikåtergivning
- Ansluta till SQL-databaser
- Extern URL
- Skapa och använda jobb för avlastning
- Konfigurerar cookie-användning
- Så här programmässigt kommer du åt AEM JCR
- Integrera tjänster med JMX-konsolen
- Developing the Bulk Editor
- Utveckla rapporter
- eCommerce
- Komponenter
- Kärnkomponenter
- Formatsystem
- Komponenter - översikt
- AEM - Grunderna
- Utveckla AEM
- Utveckla AEM - kodexempel
- JSON-exporterare för innehållstjänster
- Aktivera JSON-export för en komponent
- Bildredigeraren
- Dekoration-tagg
- Använda Dölj villkor
- Konfigurera flera redigerare på plats
- Utvecklarläge
- Testa användargränssnittet
- Komponenter för innehållsfragment
- Hämta sidinformation i JSON-format
- Internationalisering
- Klassiska gränssnittskomponenter
- Headless Experience Management
- Headless och Hybrid with AEM
- Aktivera JSON-export för en komponent
- Enkelsidiga program
- SPA introduktion och genomgång
- SPA WKND - självstudiekurs
- Getting Started with SPA in AEM - React
- Komma igång med SPA i AEM - Angular
- Implementera en React Component for SPA
- SPA djupdykning
- SPA
- Utveckla SPA för AEM
- SPA Blueprint
- SPA
- Dynamisk mappning av modell till komponent för SPA
- SPA
- SPA och Adobe Experience Platform Launch Integration
- SPA- och serveråtergivning
- SPA referensmaterial
- HTTP-API
- Innehållsfragment
- Experience Fragments
- Utvecklingsverktyg
- Utvecklingsverktyg
- AEM Modernization Tools
- Dialogruteredigeraren
- Verktyget Dialogkonvertering
- Utveckla med CRXDE Lite
- Hantera paket med Maven
- Utveckla AEM projekt med Eclipse
- Skapa AEM projekt med Apache Maven
- Utveckla AEM projekt med IntelliJ IDEA
- Så här använder du VLT-verktyget
- Så här använder du proxyserververktyget
- AEM Brackets Extension
- AEM Developer Tools for Eclipse
- AEM
- Personanpassning
- Utöka AEM
- Anpassa sidredigering
- Anpassa konsolerna
- Anpassa vyer av Sidegenskaper
- Konfigurera din sida för gruppredigering av sidegenskaper
- Anpassa och utöka Content Fragments
- Utöka arbetsflöden
- Utöka Multi Site Manager
- Spårning och analys
- Cloud Services
- Skapa anpassade tillägg
- Forms
- Integrera tjänster med JMX-konsolen
- Developing the Bulk Editor
- Utöka Classic UI
- Testning
- Bästa praxis
- Mobil webb