Bulk Editor の開発 developing-the-bulk-editor
この節では、バルクエディターツールの開発方法と、バルクエディターに基づく製品リストコンポーネントの拡張方法について説明します。
バルクエディターのクエリパラメーター bulk-editor-query-parameters
バルクエディターを操作する際には、URL に追加して、特定の設定でバルクエディターを呼び出すクエリパラメーターがいくつかあります。製品リストコンポーネントなどで、バルクエディターを常に特定の設定で使用するには、bulkeditor.jsp（/libs/wcm/core/components/bulkeditor 内）を編集するか、または特定の設定でコンポーネントを作成します。クエリパラメーターを使用した変更は、永続的ではありません。
例えば、ブラウザーの URL に次のように入力するとします。
https://<servername><port_number>/etc/importers/bulkeditor.html?rootPath=/content/geometrixx/en&queryParams=geometrixx&initialSearch=true&hrp=true
「hrp=true」によってフィールドが非表示になるので、バルクエディターは「ルートパス」フィールドなしで表示されます。パラメーター「hrp=false」を使用すると、フィールドが表示されます（デフォルト値）。
次にバルクエディターのクエリパラメーターのリストを示します。
rootPath、短い名前は rp のようになります。長い名前が定義されていない場合、短い名前がリクエストから読み取られます。バルクエディターベースのコンポーネントの作成：製品リストコンポーネント developing-a-bulk-editor-based-component-the-product-list-component
ここでは、バルクエディターの使用方法の概要について説明します。また、バルクエディターに基づく既存の Geometrixx コンポーネントである製品リストコンポーネントについても説明します。
製品リストコンポーネントを使用すると、ユーザーがデータのテーブルを表示および編集できます。例えば、製品リストコンポーネントを使用して、カタログの製品を表すことができます。情報は標準的な HTML テーブルで表示され、編集はバルクエディターウィジェットを含む 編集 ダイアログで実行されます。（このバルクエディターは、/etc/importers/bulkeditor.html またはツールメニューからアクセスできるものと同じです）。製品リストコンポーネントは、特定の制限されたバルクエディター機能に対して設定されています。バルクエディターのすべての部分（またはバルクエディターから派生したコンポーネント）を設定できます。
バルクエディターを使用すると、行の追加、変更、削除、フィルターおよび書き出し、変更内容の保存および複数行の読み込みを実行できます。各行は、製品リストコンポーネントインスタンス下の 1 つのノードとして格納されます。すべてのセルは、各ノードのプロパティです。これはデザインの選択として簡単に変更できます。例えば、リポジトリの他の場所にノードを格納できます。クエリサーブレットの役割は、表示するノードのリストを返すことです。検索パスは製品リストインスタンスとして定義されます。
製品リストコンポーネントのソースコードは、/apps/geometrixx/components/productlist にあるリポジトリで入手でき、すべての Adobe Experience Manager（AEM）コンポーネントと同様に、複数のパーツで構成されています。
- HTML レンダリングでのレンダリングは JSP ファイル（/apps/geometrixx/components/productlist/productlist.jsp）で実行されます。JSP は現在の製品リストコンポーネントのサブノードを読み取り、HTML テーブルの行として各サブノードを表示します。
- 編集ダイアログは、バルクエディター設定を定義する場所です。コンポーネントのニーズに合わせてダイアログを設定します。使用可能な列およびグリッドまたは検索で実行できるアクション。すべての設定プロパティについて詳しくは、バルクエディターの設定プロパティを参照してください。
ダイアログのサブノードの XML 表現を次に示します。
<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>
バルクエディターの設定プロパティ bulk-editor-configuration-properties
バルクエディターのすべての部分が設定可能です。次の表に、バルクエディターのすべての設定プロパティを示します。
列メタデータ設定 columns-metadata-configuration
列ごとに以下を設定できます。
-
表示プロパティ：html スタイル、CSS クラスおよび読み取り専用
-
チェックボックス
-
強制された位置
CSS および読み取り専用の列
バルクエディターには以下の 3 つの列の設定があります。
- セル CSS クラス名（cellCls）：設定する列の各セルに追加される CSS クラス名。
- セルスタイル（cellStyle）：設定する列の各セルに追加される HTML スタイル。
- 読み取り専用（readOnly）：設定する列の各セルに読み取り専用が設定されます。
設定は以下のように定義する必要があります。
"colsMetadata": {
"Column name": {
"cellStyle": "html style",
"cellCls": "CSS class",
"readOnly": true/false
}
}
次の例は、productlist コンポーネント（/apps/geometrixx/components/productlist/dialog/items/editor/colsMetadata）にあります。
<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>
チェックボックス
checkbox 設定プロパティを true に設定すると、その列のすべてのセルがチェックボックスとしてレンダリングされます。ボックスがオンの場合は true がサーバーの Save サーブレットに送信され、オフの場合は false が送信されます。ヘッダーメニューで、すべてを選択 または なしを選択 することもできます。これらのオプションは、選択したヘッダーがチェックボックス列のヘッダーの場合に有効になります。
前の例で、selection 列には、checkbox="true" のチェックボックスのみが含まれます。
強制された位置
強制された位置メタデータ forcedPosition を使用すると、グリッド内での列の位置を指定できます。0 が先頭位置で、<列の数>-1 が最終位置です。その他の値は無視されます。
前の例で、selection 列は forcedPosition="0" の最初の列です。
クエリサーブレット query-servlet
デフォルトでは、クエリサーブレットは /libs/wcm/core/components/bulkeditor/json.java にあります。別のパスを設定するとデータを取得できます。
クエリサーブレットには、GQL クエリおよび返す列を受信し、結果を計算し、結果を JSON ストリームとしてバルクエディターに送信するという機能があります。
製品リストコンポーネントの場合、クエリサーブレットに送信される 2 つのパラメーターは以下のとおりです。
- クエリ：「path:/content/geometrixx/en/customers/jcr:content/par/productlist Cube」
- cols：「Selection,ProductId,ProductName,Color,CatalogCode,SellingSku」
返される JSON ストリームは次のようになります。
{
"hits": [{
"jcr:path": "/content/geometrixx/en/products/jcr:content/par/productlist/1258674828905",
"ProductId": "21",
"ProductName": "Cube",
"Color": "Blue",
"CatalogCode": "43244",
"SellingSku": "32131"
}
],
"results": 1
}
各ヒットは 1 つのノードとそのプロパティに対応し、グリッドに行として表示されます。
クエリサーブレットを拡張すると、複雑な継承モデルを返したり、特定の論理場所に保存されたノードを返したりすることができます。クエリサーブレットを使用すると、あらゆる種類の複雑な計算を実行できます。リポジトリ内の複数ノードの集計がグリッドに行で表示されます。この場合、これらの行の変更と保存は、Save サーブレットで管理する必要があります。
保存サーブレット save-servlet
バルクエディターのデフォルト設定では、各行が 1 つのノードであり、各行のレコードにそのノードのパスが格納されます。バルクエディターは、行とノードの間のリンクを jcr パスを介して保持します。ユーザーがグリッドを編集すると、すべての変更のリストが作成されます。ユーザーが「保存」をクリックすると、更新されたプロパティ値と共に POST クエリが各パスに送信されます。これは Sling の基本的な概念であり、各セルがノードのプロパティである限り適切に機能します。ただし、クエリサーブレットで継承を計算するように実装している場合は、クエリサーブレットが返すプロパティは別のノードから継承される可能性があるので、このモデルは機能しません。
変更は、各ノードに直接反映されるのではなく、保存ジョブを行う 1 つのサーブレットに反映される、というのが保存サーブレットの概念です。これにより、そのサーブレットで変更を分析することができ、そのプロパティを適切なノードに保存できます。
更新された各プロパティは、次の形式でサーブレットに送信されます。
-
パラメーター名：<jcr path>/<property name>
例：/content/geometrixx/en/products/jcr:content/par/productlist/1258674859000/SellingSku
-
値：<value>
値：12123
サーブレットは、catalogCode プロパティが格納されている場所を認識している必要があります。
保存サーブレットのデフォルトの実装は /libs/wcm/bulkeditor/save/POST.jsp にあり、製品リストのコンポーネントで使用されます。（<jcr path>/<property name> 形式の）リクエストからすべてのパラメーターを取得し、JCR API を使用してノードにプロパティを書き込みます。また、存在しない場合は、ノードも作成されます（グリッド挿入行）。
デフォルトのコードをそのまま使用しないでください。サーバーがネイティブに実行する機能（<jcr path>/<property name> での POST）を再実装したコードなので、プロパティの継承モデルを管理する保存サーブレットを作成する際の出発点として使用するのに適しています。