3.9.0.0以上

説明

addLocalFile を使用すると、ファイルオブジェクトをコンポーネントとしてコードに直接登録することができます。

addLocalFile は非同期で動作し、引数値として使用できるオブジェクトは以下のいずれかの型である必要があります： ファイル、ブロブ。

# Tag 
<p><input type="file" id="source-file"/></p>

# Script
var dx = dx5.get("dext5");
var list = document.querySelector("#source-file").files;
if (list.length > 0) {
    dx.addLocalFile(list[0]);
}

Blobオブジェクトを使用して登録する場合は、Blobオブジェクトのnameプロパティを明示的に設定する必要があります。

# Script
var dx = dx5.get("dext5");
var blob = new Blob(["This is text data."], { type: "text/plain" });
blob.name = "sample.txt";
dx.addLocalFile(blob);

形式

component.addLocalFile(file);

パラメータ

3.7.0.0以上

説明

addLocalFileListを使用すると、コード内のコンポーネントに直接ファイルのリストを登録することができます。

addLocalFileListを使用して登録できるオブジェクトは、以下のいずれかの型である必要があります： FileList, DataTransfer, DataTransferItemList のいずれかである必要があります。

// id 'drag-area'を持つHTML要素がドラッグアンドドロップエリアである場合、
var dndArea = document.querySelector("#drag-area");

dndArea.addEventListener("dragover", function (event) {
    event.preventDefault();
    event.dataTransfer.dropEffect = "copy";
}, false);

dndArea.addEventListener("drop", function (event) {
    event.preventDefault();
    // id「dext5」を持つコンポーネントをドロップイベントで手動登録するコード
    dx5.get("dext5").addLocalFileList(event.dataTransfer);
}, false);

形式

component.addLocalFileList(obj);

パラメータ

3.9.0.0以上

説明

copyItemsメソッドは、コンポーネント間でアイテムをコピーするためのメソッドです。

copyItems の第一引数値にアイテム ID 要素を持つ配列を設定すると、ローカルファイルか仮想ファイルかを区別することなくアイテムをコピーしてコピー先に渡し、非同期で動作します。

// コンポーネント A からコンポーネント B にすべてのアイテムをコピーする例
var dxA = dx5.get("A");
var dxB = dx5.get("B");
var targets = dxA.getItemIds();
// targets: ['DX5-NUM-1', 'DX5-NUM-2', 'DX5-NUM-3', ...]
dxA.copyItems(targets, dxB, function (copied) {
    console.log("Copied!");
});

コールバック関数を使うと、コピー前のアイテムのIDとコピー後のIDを比較することができます。

dxA.copyItems(targets, dxB, console.log);
# このような出力例が得られるはずです。
[
    { "before": "DX5-1709096638301-1", "after": "DX5-1709096640677-1" },
    { "before": "DX5-1709096639314-2", "after": "DX5-1709096640735-2" },
    { "before": "DX5-1709096639371-3", "after": "DX5-1709096640796-3" },
    { "before": "DX5-1709096639425-4", "after": "DX5-1709096640854-4" }
]

注意事項

• コピーされるアイテムがローカルファイルの場合、コピーされるアイテムも同じローカルファイルを指します。
• アイテムの checked プロパティと lock プロパティもコピーされます。
• アイテムの id 属性、controlId 属性、status 属性はコピーされません。

形式

component.copyItems(list, anotherComponent, cbCopied);

パラメータ

3.9.0.0以上

説明

moveItems メソッドは、コンポーネント間のアイテムの移動に使用します。

moveItemsの第一引数にアイテムIDの要素を持つ配列を設定すると、ローカルファイルか仮想ファイルかを区別することなく、ターゲットがアイテムを移動し、非同期で動作します。

// コンポーネント A からコンポーネント B にすべてのアイテムを移動する例
var dxA = dx5.get("A");
var dxB = dx5.get("B");
var targets = dxA.getItemIds();
// targets: ['DX5-NUM-1', 'DX5-NUM-2', 'DX5-NUM-3', ...]
dxA.moveItems(targets, dxB, function (moved) {
    console.log("Moved!");
});

コールバック関数を使えば、移動前のアイテムのIDと移動後のIDを比較することができる。

dxA.moveItems(targets, dxB, console.log);
# このような出力例が得られるはずです。
[
    { "before": "DX5-1709096638301-1", "after": "DX5-1709096640677-1" },
    { "before": "DX5-1709096639314-2", "after": "DX5-1709096640735-2" },
    { "before": "DX5-1709096639371-3", "after": "DX5-1709096640796-3" },
    { "before": "DX5-1709096639425-4", "after": "DX5-1709096640854-4" }
]

注意事項

• アイテムのcheckedプロパティとlockプロパティも保持されます。
• アイテムのid、controlId、status属性は保持されません。

形式

component.copyItems(list, anotherComponent, cbCopied);

パラメータ