Mashup Builder > 小器具 > 標準小器具 > 檔案上載小器具 (主題化)
檔案上載小器具 (主題化)
「檔案上載」小器具可讓使用者將一或多個檔案上載至 ThingWorx 存放庫。您可以使用下列其中一種方式配置小器具來上載檔案:
按一下「瀏覽」按鈕來選取本機系統中的檔案。當按一下「上載」按鈕時,即會上載所選檔案。
將檔案從您的本機系統拖曳到小器具上的放置區域。
* 
主題化「檔案上載」小器具在 ThingWorx 9.3.4 或更新版本中提供。
此外,您也可以配置驗證規則,以對檔案類型、大小、數量等套用限制。
小器具解析
拖放
1. 檔案存放庫選取器
2. 檔案放置區域
3. 已上載的檔案
4. 存放庫路徑
當您在此模式下拖曳或選取檔案時,系統會根據 DisableInstantUpload 內容的值即時上載或列出檔案。或者,您也可以使用按鈕或小器具 Upload 服務來手動禁用 AllowInstantUpload 內容及上載檔案。此外,還會顯示「取代」按鈕,可讓您取代存放庫中的已上載檔案。
僅限瀏覽按鈕
1. 檔案存放庫選取器
2. 「瀏覽」按鈕
3. 所選檔案
4. 存放庫路徑
禁用即時上載
依預設,會將所選檔案自動上載至存放庫。會顯示進度列,指示上載每個檔案的進度。
欲讓使用者在上載之前審核所選檔案,請將小器具 DisbaleInstantUploadShowUploadButton 內容設定為 true。在執行時間,使用者可以按一下「上載」按鈕來啟動上載。或者,將混搭、函數或小器具事件繫結至小器具 Upload 服務,以根據特定條件啟動上載。
新增刪除按鈕
您可以新增刪除按鈕,以讓使用者停止上載並從清單中移除所選檔案。已上載的檔案只會從清單中移除,而不會從 ThingWorx 存放庫中刪除。欲從存放庫中刪除檔案,請使用自訂資料服務。
將檔案上載至 ThingWorx 存放庫
依預設,使用者可以使用可用控制項來選取要將檔案上載至的存放庫及資料夾。為防止使用者選擇存放庫或資料夾路徑,請將 ShowRepositorySelectorShowRepositoryPath 內容設定為 false。您可以使用小器具 RepositoryNamePath 內容指定預設存放庫名稱與資料夾。如需有關平台中存放庫的詳細資訊,請參閱管理檔案存放庫
驗證檔案大小
依預設,使用者可以在執行時間上載任何大小的檔案。您可以使用「驗證」面板上的小器具 MaxFileSize 內容來限制可上載的最大檔案大小。欲自訂檔案大於所允許最大值時的失敗訊息,請配置 MaxFileSizeFailureMessageMaxFileSizeFailureTitle 內容。
驗證上載大小
您可以使用 MaxUploadSize 驗證內容來限制上載的總大小。上載總大小超過限制時,會顯示失敗訊息。欲自訂錯誤訊息,請使用 MaxUploadSizeFailureMessageMaxUploadSizeFailureTitle 內容。
最大檔案數
您可以使用「驗證」面板上的小器具 MaxFileSize 內容來限制使用者可以上載的檔案數上限。當所選檔案數大於最大值時,會顯示失敗訊息。欲自訂錯誤訊息,請使用 MaxNumberOfFilesFailureMessage 內容。
限制檔案類型
您可以使用 AllowedFileTypes 內容將小器具配置為接受特定檔案格式。您可新增多個檔案類型,並以逗號分隔。例如,鍵入:.pdf, .png 即可僅允許 PDF 與 PNG 檔案。使用 AllowedFileTypesMessageAllowedFileTypesTitle 內容可自訂在新增不支援的檔案類型時顯示之錯誤訊息。
* 
請考慮在放置區域標籤中列出支援的檔案類型。
配置檔案放置區域
您可以將檔案拖曳至放置區域,或按一下標籤來開啟檔案選取對話方塊。區域顏色會自動變更,以指示您可以放置檔案。
您可使用下列內容來配置放置區域:
DropZoneHeight - 設定放置區域的特定高度。
DropZoneIcon - 將媒體實體顯示為圖示。
DropZoneLabel - 設定要顯示的標籤。您可使用此內容來提供有關所支援檔案類型與大小的資訊。
小器具內容
下表列出了「內容」面板中提供的內容。
屬性名稱
描述
基礎類型
預設值
是否可繫結 (Y/N)
可當地語系化 (Y/N)
BrowseButtonLabel
設定「瀏覽」按鈕的標籤。
STRING
瀏覽
Y
Y
BrowseButtonType
設定「瀏覽」按鈕類型。選項:「主要」「次要」「第三」
STRING
「主要」
N
N
ClearList
這是會清除所選檔案清單的可繫結服務。
服務
n/a
Y
N
CustomClass
設定要套用至小器具頂部 div 元素的 CSS 類別。您可以輸入多個類別,並以空格分隔。
STRING
n/a
Y
N
DisableInstantUpload
選取檔案時,禁用即時上載
BOOLEAN
False
DropZoneHeight
設定檔案放置區域的高度。
NUMBER
96
DropZoneIcon
設定要在放置區域中顯示的圖示。
IMAGELINK
n/a
DropZoneLabel
設定放置區域的標籤。
STRING
「將檔案拖至此處或按一下以瀏覽」
FileNames
包含所選檔案的名稱。
STRING
n/a
Y
N
FileUploadMode
指定在執行時間選取檔案的方式。您可以拖放或顯示瀏覽按鈕。
STRING
「拖放」
N
N
RepositoryName
小器具使用之檔案存放庫的名稱。
THINGNAME
SystemRepository
Y
N
ShowRespositorySelector
顯示目的地檔案存放庫是否應為可編輯。
BOOLEAN
True
N
N
Path
要將檔案上載至之存放庫中的資料夾路徑。
STRING
n/a
Y
N
MultiFilesSelect
啟用多個檔案選取項。
BOOLEAN
False
N
N
ShowDataLoading
載入資料時顯示展開圖示。
BOOLEAN
True
N
N
Width
小器具寬度。
NUMBER
302
N
Height
小器具高度。
NUMBER
95
N
N
Visible
設定小器具在執行時間的可見度。
True
True
N
N
ClearList
清除新增至小器具的檔案清單。
n/a
n/a
Y
N
DisbaleInstantUpload
選取檔案之後,禁用即時上載。若設定為 false,只會在按一下上載按鈕之後上載檔案。
False
False
Y
N
ResetToDefaultValue
將小器具的輸入重設為其預設值。
n/a
n/a
Y
N
ShowDeleteAllButton
顯示全部刪除按鈕,並可讓使用者取消上載及刪除所有已上載的檔案。
BOOLEAN
False
N
N
ShowRepositoryPath
可讓使用者使用文字欄位指定存放庫內的路徑。
BOOLEAN
True
N
N
ShowRepositorySelector
顯示一個下拉清單,以讓使用者選取要將檔案上載至的 ThingWorx 存放庫。
BOOLEAN
True
N
N
ShowUploadButton
顯示用來上載所選檔案的上載按鈕。此內容只有在 InstantUpload 設定為 false 時才可用。
BOOLEAN
False
N
N
UploadComplete
檔案上載完成時觸發的可繫結事件。
n/a
n/a
Y
N
Upload
這是上載所選檔案的可繫結服務。
服務
UploadDescription
設定用於指導使用者上載哪些檔案的描述文字。
n/a
n/a
Y
N
UploadDescriptionType
用來顯示描述文字的標籤類型。
本文
本文
N
N
UploadStarted
上載開始時觸發的可繫結事件。
n/a
n/a
Y
N
UploadFailed
檔案無法上載時觸發的可繫結事件。
n/a
n/a
Y
N
驗證檔案上載小器具資料
與支援驗證的其他小器具不同,「檔案上載」不支援驗證與條件訊息。您可以定義條件訊息並啟用 ShowFailureMessage,來在 ValidationStateInvalid 時顯示失敗訊息。
* 
「樣式內容」面板上設定失敗訊息的樣式時,只有 Invalid 狀態可用。
如需有關使用通用驗證內容的詳細資訊,請參閱文字欄位小器具 (主題化)
下表列出了 ThingWorx 9.3.4 或更新版本中「驗證」面板上可用的驗證內容。
名稱
描述
基礎類型
預設值
可繫結?
可當地語系化?
AllowedFileTypes
設定使用者可以選取的允許檔案類型,並以逗號分隔。例如:.png, .pdf, .txt
STRING
N/A
Y
N
AllowedFileTypesMessage
新增不支援的檔案類型時顯示的訊息。
STRING
Y
Y
AllowedFileTypesMessageDetails
在列出所允許檔案類型的訊息下顯示的詳細資訊。
STRING
Y
Y
CriteriaMessage
為驗證條件以及驗證失敗時顯示的訊息。
STRING
Y
Y
CriteriaMessageDetails
為驗證條件和失敗訊息顯示的詳細資訊。
STRING
Y
Y
FileRequired
需要上載檔案。
BOOLEAN
False
Y
N
FileRequiredMessage
遺失所需檔案時顯示的訊息。
STRING
Y
Y
FileUploadErrorDetails
顯示無法上載之檔案之相關其他詳細資訊的訊息。
STRING
Y
Y
FileUploadErrorMessage
檔案上載失敗時顯示的訊息。
STRING
Y
Y
MaxFileSize
以 MB 為單位設定每個個別檔案的最大大小限制。
NUMBER
N/A
Y
N
MaxFileSizeFailureMessage
檔案超過所允許的最大檔案大小時顯示的訊息。
STRING
Y
Y
MaxFileSizeFailureTitle
檔案大小超過所允許的最大檔案大小時顯示的對話方塊標題。
STRING
Y
Y
MaxNumberOfFiles
設定可新增至上載清單的檔案數上限。
NUMBER
N/A
Y
Y
MaxNumberOfFilesFailureMessage
新增檔案數超過最大值時顯示的訊息。
STRING
Y
Y
MaxUploadSize
設定選取多個檔案時的上載最大大小限制 (MB)。
NUMBER
N/A
Y
N
MaxUploadSizeFailureMessage
總檔案大小超過最大允許檔案大小時顯示的訊息。
STRING
Y
Y
MaxUploadSizeFailureTitle
總檔案大小超過所允許的最大值時顯示的對話方塊標題。
STRING
Y
Y
ShowValidationFailure
驗證失敗時顯示失敗訊息。
BOOLEAN
False
Y
N
Validate
小器具值變更時觸發的事件。將此事件繫結至服務或函數以套用驗證模式或運算式。
事件
N/A
Y
N
ValidationFailureIcon
設定當驗證失敗時要在狀況訊息中顯示的 SVG 圖示。
IMAGELINK
cds:icon_error
N
N
ValidationOutput
擷取小器具驗證的輸出。傳回的值為 UndefinedUnvalidatedValidInvalid
STRING
N/A
Y
N
ValidationState
這是設定驗證狀態的可繫結內容。您可以將此內容設定為 UndefinedUnvalidatedValidInvalid
STRING
Undefined
Y
N
這是否有幫助?