2014年8月22日 星期五

Select2 套件基本用法

Select2 套件是一個加強下拉選單的套件,官網提供了許多詳細的示範
這裡用一個簡單的例子來介紹這個套件
首先開一個Web專案

用一個html頁面來練習

透過NuGet新增select2.js套件

select2.js套件包含了CSS和JavaScript和語系

在html裡面引用CSS和JavaScript,該套件相依於JQuery,最低版本1.7以上

手動輸入一個下拉選單

一般的下拉選單看起來像這個樣子

透過JQuery啟用select2

看起來漂亮多了,而已還有查詢過濾的功能

加入多選屬性

Select2套件的多選功能

參考資料

Select2 官網

Select 2 CDN

Select2 Bootstrap 3 CSS