ASP.NET MVC 實作練習:兩個 ListBox 互傳選取項目

錄製了一個短片,示範如何實作一個供使用者挑選多重項目的對話窗。此對話窗包含兩個 ListBox,一左一右,使用者能夠將左邊 listbox 中的項目選取並移動至右邊,或從右邊丟回左邊,以這種左右互傳的方式來選取多重項目。使用的工具是 Visual Studio 2012。

下圖為範例程式的執行結果:


影片在此:


影片有點長,一方面是因為練習步驟比較多,二方面是我也沒太多時間重新錄製和剪接影片。儘管事前準備了小抄,中間還是有點凸槌,有些地方停頓了一下(腦袋一片空白?),有時候還出現手機干擾的噪音(錄製時並未聽見,後製時已盡量刪除噪音)。缺點不少,不嫌棄的話,就湊和著看囉。

我想,即使對 ASP.NET MVC 不是那麼熟,照著影片來逐步練習,應該也能順利完成。若拿來當作 ASP.NET MVC 的入門練習題目,或許也是不錯的選擇,儘管會碰到不少問題,但如果耐心做完每一個步驟,碰到不懂的地方就查一下相關資料,便可順便學習 ASP.NET MVC 的一些基本技巧,例如 BundlingView ModelPartial ViewRazor 語法等等。當然,還有 jQuery。

完整範例程式碼可至 CodePlex 網站下載
範例程式使用的 Northwind 資料庫也可以至 CodePlex 網站下載

參考資料


2 則留言:

  1. 謝謝版主分享,還錄製影片真是佛心來的

    回覆刪除
  2. 其實我自己也想再實作一遍,就順便啦...不過花的時間還是超過原先想像 XD

    回覆刪除

技術提供:Blogger.
回頂端⬆️