このトピックは、コード例を示して、 WebUpload™ コントロールを構成する方法を説明します。
このトピックを理解するためには、以下のトピックを理解しておく必要があります。
このトピックは、以下のセクションで構成されます。
WebUpload コントロールは、多数のカスタマイズ オプションがあります。使用できるファイル タイプを制御、同時にアップロードするファイル数の指定、ファイル パネルでユーザー操作を構成できます (アップロード可能なファイル数と WebUpload パネル の表示)。また、アップロードが自動的に開始するか明示的なユーザー操作によって開始するかを選択します詳細については、WebUpload 構成概要図 とそれに続くセクションをご参照ください。
以下の表は、 WebUpload で構成可能な機能を示します。このメソッドについては、表の下にある解説もご参照ください。
ユーザーによるファイル選択が可能かどうか、いつファイルを選択するか、また一度に複数のファイルを選択できるかどうかを構成できます。この機能は、 WebUpload のファイル選択モードで管理されます。ファイル選択モードは、単一ファイル (ユーザーは 1 パスで 1 ファイル選択可能) または複数ファイル (ユーザーは 1 パスで複数ファイル選択可能) です。
ユーザーは複数ファイル選択モードで以下が可能です。
ファイル Open ダイアログから複数ファイルを選択。
ファイルを Windows® Explorer から WebUpload コントロールへドラッグ アンド ドロップ
単一ファイル選択モードでは、Open ダイアログでユーザーが選択できるのは 1 ファイルのみで、ファイルのドラッグ アンド ドロップもできません。複数ファイルをアップロードしたい場合、 WebUpload コントロール パネルでファイルを追加する操作を繰り返す必要があります。
以下の画像は、2 通りのファイルを選択する方法を示します。開く ダイアログから開く、あるいは Windows エクスプローラーから WebUpload コントロールパネルへドロップして複数のファイルを開きます。
デフォルトのファイル選択モードは、単一ファイルです。
ファイル選択モードは、 Mode および MultipleFiles オプションによって管理されます。 Mode が Multiple の場合のみ MultipleFiles を true に設定にする意味があります。 Mode が 単一 の場合、 MultipleFiles は効果がありません。
ファイル選択モード機能は、input
要素の HTML 5 複数属性 を採用します。これにより、機能がブラウザー依存となります。サポートされていないブラウザーが使用されると、機能のプロパティを設定しても効果はありません。つまり、ユーザーは、ファイルを開くダイアログまたは WebUpload コントロールへドラッグ アンド ドロップして複数のファイルを選択することはできません。サポートされるブラウザーの一覧は、要件をご覧ください。
以下は、ファイル選択タイプを構成するための要件です。
input
要素の HTML 5 multiple
属性をサポートするブラウザー
この機能は以下のブラウザーでのみ使用できます。
以下の表では、各プロパティ設定の構成です。
これは、以下の設定の結果として複数のファイル選択を有効にする方法の例です。
以下のコードはこの例を実装します。
ASPX の場合:
<ig:WebUpload ID="WebUpload1" runat="server" Mode="Multiple" MultipleFiles="True">
</ig:WebUpload>
ユーザーが WebUpload パネルにファイルを追加すると、アップロードが自動的に開始または手動で開始 (ユーザーの Upload ボタン押下によって) するかどうかを構成します。 WebUpload コントロールの機能は、アップロード トリガーと呼ばれます。アップロード トリガーは、ファイル アップロードの自動スタートを有効または無効にします。
デフォルト アップロード トリガーは手動です。
アップロード トリガーは、 WebUpload コントロールの AutoStartUpload オプションによって管理されます。
以下の表では、各プロパティ設定の構成です。
これは、以下の設定の結果として自動アップロードを有効にする方法の例です。
以下のコードはこの例を実装します。
ASPX の場合:
<ig:WebUpload ID="WebUpload1" runat="server" AutoStartUpload="True">
</ig:WebUpload>
ユーザーがアップロードできるファイルのタイプを構成できます。この機能は、許容されるファイル タイプの一覧で使用可能なファイル タイプのファイル名拡張子を明示的にリストして処理されます。このリストは、 AllowedExtensions プロパティの値として使用可能なファイル拡張子を表す FileUploadExtension
オブジェクトのコレクションです。
デフォルトですべてのファイル タイプが更新できます。
ファイル拡張子の検証は、選択されたファイル拡張子を AllowedExtenstions
プロパティで宣言された拡張子の一覧と比較します。拡張子の検証が失敗すると、 WebUpload の onError イベントが発生します。 onError ハンドラーの 2 つ目のパラメーターは、プロパティ errorCode
= 2
および errorMessage
= “ファイル拡張子の検証に失敗しました。”
のあるオブジェクトを含みます。ユーザーに表示するエラーはカスタマイズ可能です。
以下の表では、各プロパティ設定の構成です。
この例は、.xls および .doc ファイルのアップロードを許可するユーザーを設定する方法を示します。
以下のコードはこの例を実装します。
ASPX の場合:
<ig:WebUpload ID="WebUpload1" runat="server">
<AllowedExtensions>
<ig:FileUploadExtension Extension="doc" />
<ig:FileUploadExtension Extension="xls" />
</AllowedExtensions>
</ig:WebUpload>
ページの更新ごとにアップロードできる最大ファイル数を構成できます。制限に達すると、 WebUpload コントロール パネルの 追加ボタンが無効になります。ファイル選択モードが複数の場合、最大ファイル数を超えてファイルを選択するとエラーがスローされます。
デフォルトでは、アップロードするファイル数に制限はありません。
MultipleFiles
= True
の場合、ユーザーがこのしきい値を超えてファイルを選択すると WebUpload onError イベントが発生します。 onError ハンドラーの 1 つ目のパラメーターは、プロパティ errorCode
= 2
および errorMessage
= “アップロードが可能な最大ファイル数を超えました。”
のあるオブジェクトを含みます。ユーザーに表示するエラーはカスタマイズ可能です。
以下の表では、各プロパティ設定の構成です。
これは、最大ファイル アップロード数を 2 に設定します。
以下の画像は、最大ファイル アップロード数に達した結果として、追加 ボタンを無効にする方法を示します。
以下のコードはこの例を実装します。
ASPX の場合:
<ig:WebUpload ID="WebUpload1" runat="server" MaxUploadedFiles="2">
</ig:WebUpload>
同時にアップロードするファイル数を制限できます。しきい値を超えてファイルを選択すると、同時アップロードファイル数をこのしきい値に制限します。先着順で、アップロードされるファイルがしきい値以下になるまで超過ファイルのアップロードを停止します。この処理は、他のファイルのアップロードが完了するについれて、同時アップロードに追加されている残りの各ファイルで実行されます。
同時アップロード可能な最大ファイル数は MaxSimultaneousFilesUploads プロパティで管理されます。
以下の表では、各プロパティ設定の構成です。
以下のコード サンプルでは、最大ファイル アップロード数を設定する方法を示します。
以下のコードはこの例を実装します。
ASPX の場合:
<ig:WebUpload ID="WebUpload1" runat="server" MaxSimultaneousFilesUploads="2">
</ig:WebUpload>
WebUpload コントロールのパネルに表示するファイル数を構成できます。この機能は、 WebUpload のファイル表示モードで管理されます。ファイル選択モードは、単一ファイル (パネルに 1 ファイルのみ表示) または複数ファイル (パネルに表示される複数ファイル)。
複数ファイル モードは、パネルに複数のファイルを垂直に表示します。
単一ファイル モードでは、一度に 1 ファイルのみ表示できます。
以下の画像は、単一ファイル モードと複数ファイル モードを比較します。
デフォルトのファイル選択モードは、単一ファイルです。
複数ファイルモードで表示されるファイル数は、 MaxUploadedFiles で設定された数を超えることはできません。状況に従い MaxUploadedFiles 設定の結果は以下となります。
MultipleFiles = False の場合、ファイル数が MaxUploadedFiles の設定と同じになると自動的にボタンを無効にします。
MultipleFiles = True の場合、選択したファイル数が MaxUploadedFiles の設定を超えるとエラーをスローします。
以下の表では、各プロパティ設定の構成です。
この例は、表示モードを複数ファイルに設定する方法を示します。これは以下の設定の結果です。
以下のコードはこの例を実装します。
ASPX の場合:
<ig:WebUpload ID="WebUpload1" runat="server" Mode="Multiple">
</ig:WebUpload>
このトピックにの追加情報については、以下のトピックも合わせてご参照ください。
このトピックについては、以下のサンプルも参照してください。