三招讓你提升使用者的查詢體驗:開啟參考欄位、邊打邊找、過濾條件大小類
Jones, Judy 2020-10-08在Smart Query HTML的OLTP查詢頁面中,可以將要用來查詢的欄位新增為條件,例如:將「客戶編號」欄位設為查詢條件,讓使用者輸入客戶編號來查資料。不過,有時候只利用文字搜尋並不方便,因為使用者不一定記得他想查的客戶編號是幾號,只記得客戶姓名與其所屬的公司。此時,若有其他如「客戶名稱」、「公司名稱」的參考欄位顯示在客戶編號旁邊,就能幫助使用者順利找到他想查的客戶資料。
Smart Query內建的搜尋功能遠比你想得還要強大,除了讓使用者輸入文字和數值,還能運用Foreign Key來顯示參考欄位,讓使用者在查詢時能參考其他資料來輔助搜尋,提升搜尋體驗與效率。Foreign Key主要有三種應用:
- 開啟參考欄位
- 邊打邊找列出條件清單
- 過濾條件大小類
接下來,將詳細介紹以上三招查詢應用,設計者可以依據使用者需求以及資料的特性來決定要使用哪一招!
第一招:開啟參考欄位
開啟參考欄位是Foreign Key的第一種應用,設定了 Foreign Key 後,查詢畫面會出現放大鏡的圖示,點選時會彈出視窗,開啟原本的條件與我們所設定的參考欄位,使用者可以對主條件欄位或輔助欄位往下進階搜尋,帶出完整的條件值,加快使用者的查詢效率。
Foreign Key 視窗功能介紹
請根據圖2的編號來對照功能:
- 放大鏡:有設定 Foreign Key 的條件執行時,Text Box旁會出現放大鏡的圖示,點選就會跳出鍵值欄位(客戶編號)、主參考欄位(公司名稱),提供使用者比對參考。
- 欄位下拉選單:上圖中左下角有個下拉選單,可以下拉選擇要搜尋的欄位。
- 查詢條件:選擇好欄位就可以在旁邊的輸入框輸入文字、數值。
- 泛查(放大鏡):在Text Box輸入關鍵字後,再點選旁邊的放大鏡就能進行泛查,意即只要開頭有使用者所輸入的關鍵字就會被搜尋出來,如同 SQL 中 LIKE 'A%' 的效果,顯示所有以 'A' 起頭的字串。舉例來說,'ABCD' 和 'ABCABC' 都符合這個模式。
- 全文檢索:在Text Box輸入關鍵字後,點選全文檢索就能將所有包含關鍵字的欄位都搜尋出來,如同 SQL 中 LIKE '%AN%' 的效果,顯示所有包含 'AN' 的字串。舉例來說,以A關鍵字來搜尋,'LOS ANGELES' 和 'SAN FRANCISCO' 皆會是搜尋結果。
- 每頁筆數:預設每頁帶10筆資料,底下每頁筆數可以手動調整輸入想要的筆數,按Enter 就可以變換每頁筆數。
- 切頁:左下角有數字框與左右箭頭,可以快速用輸入數值或左右切換的方式來切換頁數。
如何設定Foreign Key,開啟參考欄位?
下面以一家企業的訂單明細查詢頁面為例,以「客戶編號」為查詢的條件,該如何設定條件的 Foreign Key 功能才能使「公司名稱」欄位成為參考欄位?
新增Foreign Key
在條件頁籤下,選擇欲加Foreign Key的條件(客戶編號: [訂貨主檔.客戶編號]=客戶編號1),接著點選Foreign Key就可以新增自訂Foreign Key。
設定參考欄位
新增自訂Foreign Key 後,需要選擇欄位所在的關聯資料表、鍵值欄位與主要參考欄位,設定如下:
- 關聯資料表:[客戶]
- 鍵值欄位:[客戶編號]、鍵值標題:[客戶編號]、鍵值型別:[string]
- 主參考欄位:[公司名稱]、欄位標題:[公司名稱]、欄位型別:[string]
設定其他參考欄位
如圖5,若想要增加更多輔助的參考欄位,可以到 Foreign Key 的其他參考欄位頁籤設定。
圖5. 新增更多參考欄位
如圖6,使用者在查詢時,就能看到多項參考欄位(聯絡人、地址)。
圖6. User端所看到的參考欄位
第二招:邊打邊找
Foreign Key應用的第一招是利用視窗開啟參考欄位,第二招則是在使用者輸入關鍵字的同時,自動列出與關鍵字相關的參考欄位,正所謂「邊打邊找」,使用者一邊輸入條件,系統一邊找出相關的鍵值欄位、主參考欄位,以及其他參考欄位。圖7列出了十項編號內包含A的「客戶編號」,以及「公司名稱」、「聯絡人」與「地址」等參考欄位。
如何設定邊打邊找?
此為Foreign Key的進階功能,在Foreign Key頁籤中的屬性頁籤,將邊打邊找勾選起來就完成了!
第三招:過濾條件大小類
條件大小類的設定運用於當查詢頁面有多個條件且條件之間有群組關係時,舉例來說,超市的食品有上百種,資訊人員在建立資料表時,可能會將食品先分成幾大類,接著再細分小類,如圖9資料表中,左邊為食品的大類,右邊為食品大類中的小類,此處的大小類具有群組關係,例如,蘋果汁位於飲料群組中,無法被歸類為調味品。
如圖10,設計查詢頁面時,若要以此兩項為搜尋條件(大類:類別編號、小類:產品編號),必須要過濾小類所列出的參考欄位,否則當使用者已經選了飲料大類後,除了看見飲料小類,還會看見調味品小類的選項,於使用上並不合理。因此,Foreign Key還有一項進階功能:
如何設定過濾條件大小類?
使用條件過濾功能,可以讓我們利用已輸入的條件(大類)進一步限制其他條件(小類)可選的值。
- 切換至Foreign Key的條件頁籤
- 切換至小類條件(產品編號)的Foreign Key頁籤,點選條件頁籤。
- 新增條件
- 點選 + 符號新增條件,設定如下:
1.欄位:類別編號 2.依據條件:類別編號1
給設計者的小叮嚀: |
---|
◆使用過濾條件大小類功能前,需先設定Foreign Key。 |
以上就是Foreign Key能為使用者帶來的便利,第一招利用參考欄位視窗,讓使用者點選條件;第二招讓使用者在輸入條件的同時,能看見參考欄位;第三招讓使用者能夠先選大類條件,再選小類條件。希望透過這三招條件搭配 Foreign Key,增加查詢條件的多樣性,提供使用者更好的搜尋體驗!