情境:
客戶希望可以製作一個表格,裡面放置著店家名稱、電話、地址、星級
然後星級希望可以透過大小台排序,星級越高就排在越前面
當時的想法有兩項
1.星星使用fontawesome來製作,後面再做一個數字欄位,來對應前方的星星數量
2.星星使用圖片來製作,例如5顆星星的圖片檔名使用 5.png,4顆星星使用4.png…以此類推
排序的規則會按照檔案名稱大小來做排列。
實際修改:
首先要把”篩選星級”的cloumn改隱藏起來,這邊可以使用CSS
然後再新增一個filter來”篩選星級”這個欄位
事實上是filter數字,但是因為欄位連動所以視覺上很像是針對星星去做篩選
實際的篩選效果
這篇只是記錄星級篩選的思考邏輯過程,詳細的NinjaTables功能介紹就不在這邊細說了
另外filter需要使用pro版才有,如果沒有購買pro版的人可以往第二種思路去做看看,理論上可以做到一樣的效果。