A08-09 下拉復選框元件

1. 在設計表單時，有的資訊需要讓使用者做多項選擇，選項較多不希望全部展示出來時，可以在儲存格中插入下拉複選框元件。

2. 選項需要用資料字典設定，使用者預覽表單時，看到的選項是顯示值，使用者提交表單後，提交的資料是實際值。

3. 下拉複選框元件作為一種填報元件，僅在填報預覽和新填報預覽時使用。

1

插入下拉複選框元件。

1. 選中B2儲存格，點擊【元件設定】，點擊下拉框，選擇【下拉複選框元件】。

2. 同樣操作給C2儲存格也插入下拉複選框元件。

2

基本-元件名。

1. 可以為B2、C2中插入的下拉複選框元件設定元件名。

2. 元件名可手動輸入任意名稱，也可選擇全域參數或伺服器資料源參數。

3. 元件名選擇參數，即將參數和元件進行了綁定，在元件中輸入的值，可通過參數來實時傳遞。

4. 擁有名稱後，可以通過JavaScript獲取元件，從而修改元件屬性。

3

進階-資料字典。

1. 選中B2儲存格，點擊【資料字典】後的【...】，進入資料字典設定面板。

2. 型別設定為【資料庫表】，資料庫選擇【FRDemoTW】，選擇資料庫表【銷量】。

3. 設定【實際值】欄名為【產品】，【顯示值】欄名也為產品。

4. 點擊【確定】，完成設定。

5. 同樣操作給C2儲存格也設定資料字典。

6. 可設定不同型別的資料字典，資料字典設定可參考A06-08 樣式-資料字典。
   

4

預覽下拉複選框元件。

1. 滑鼠右鍵點擊欄【B】，選擇【欄寬】，輸入40，點擊【確定】。

2. 滑鼠右鍵點擊欄【C】，選擇【欄寬】，輸入40，點擊【確定】。

3. 點擊填報預覽，在瀏覽器中查看效果，點開下拉複選框展示了所有的產品選項，可以直接點擊選擇。

5

基本-可用。

1. 勾選可用時，正常顯示。

2. 不勾選可用時，顏色會被淡化掉，元件也無法點擊執行。

3. 設定B2儲存格元件不可用，預覽效果。
   

6

基本-可見。

1. 勾選可見時，可看得到元件。

2. 勾選不可見時，元件會被隱藏起來不顯示。

3. 設定元件不可見時，需先點擊【範本】→【範本web屬性】→【填報頁面設定】，勾選【直接顯示元件】。

4. 設定B2儲存格元件不可見，預覽效果。

7

進階-水印。

1. 設定水印後，當元件值為空時，在元件上會以淺灰色的文字顯示。

2. 當我們點擊元件後，水印就會消失，可以當做提示文字或數字。

3. 給B2儲存格元件設定水印，輸入值：請選擇。

4. 點擊填報預覽，在瀏覽器中查看效果。

8

進階-標籤形式顯示。

1. 勾選標籤形式顯示時，選項會有圓角的標籤樣式。

2. 不勾選標籤形式顯示時，選項正常顯示，多個選項間以逗號隔開。

3. 設定B2儲存格取消勾選標籤形式顯示。

4. 點擊填報預覽，在瀏覽器中查看效果。

9

進階-傳回值型別-陣列。

1. 選擇陣列型別，傳回的資料以逗號隔開各選項。

2. 設定B2儲存格傳回值型別為陣列，在D2儲存格中插入公式=B2，查看傳回值效果。

3. 點擊填報預覽，在瀏覽器中查看效果。

10

進階-傳回值型別-字串。

1. 選擇字串型別，可自訂分隔符，起始符，結束符，傳回的資料會包含這些符號進行顯示。

2. 設定B2儲存格傳回值型別為字串，分隔符為【分號】，起始符為【單引號】，結束符為【單引號】。

3. 點擊填報預覽，在瀏覽器中查看效果。

11

校驗-允許為空。

1. 勾選允許為空，表示元件可以為空顯示。

2. 不勾選允許為空，會彈出錯誤提示設定，預覽當元件為空時，會彈出設定的錯誤提示。

3. 設定B2儲存格取消勾選允許為空，設定錯誤提示為：請選擇一個產品。

4. 點擊填報預覽，在瀏覽器中查看效果。

12

校驗-允許直接編輯。

1. 勾選允許直接編輯，點擊元件空白處，可以直接在元件上輸入值來模糊查詢。

2. 不勾選允許直接編輯，點擊元件空白處，沒有作用。

3. 設定B2儲存格不勾選允許直接編輯。

4. 點擊填報預覽，在瀏覽器中查看效果。

13

校驗-允許自訂值。

1. 勾選允許自訂值，點擊元件空白處，可以直接在元件上輸入值，且可以輸入不是元件裡的資料值。

2. 不勾選允許自訂值，點擊元件空白處，輸入不是元件裡的資料值，會彈出值不在下拉欄表內的提示視窗。

3. 設定B2儲存格取消勾選允許自訂值。

4. 點擊填報預覽，在瀏覽器中查看效果。