把Silverlight跟jQuery摻在一起做成瀨尿牛丸吧! 地址輸入輔助器
一直以來,Silverlight多被定位成取代傳統網頁的進階式操作介面。說實在話,在Client端用C#、LINQ寫Code,一直是我夢寐以求的開發環境(但我心中真正的夢幻解決方案是希望HTML6規格直接可以支援C# XD),但取代傳統網頁這個前題卻讓我有些為難。
現實是殘酷的,當開發團隊的技能仍以jQuery、ASP.NET為主軸,且各式Plugin、控件也十分齊備成熟,要貿然發動一場革命捨去既有網站開發基礎不用,要求全面改用Silverlight重新摸索,最後的下場只怕會被拉到牆角餵磚頭吧!
那那那... 想在Web Client端寫C#的夢想又幻滅了嗎?
靈光一現: "摻在一起做成瀨尿牛丸不就得了? 笨蛋!"
前陣子研究過Silverlight Interop(1 2 3 4 5 6 7),原則上,Silverlight與HTML DOM、Javascript 間的溝通管道還算齊備。這麼說來,把複雜邏輯放在Silverlight裡用C#、LINQ輕鬆解決,呈現介面再交還給jQuery打理的理想並不難實現。
最近搞了一個輸入台灣地址的自動完成輔助器,利用中華郵攻的3+2郵遞區號資料XML檔 當資料源,轉成List<Object>配合LINQ就可簡易又快速地進行各式查詢,產生地址提示。原本先寫了純Silverlight版,後來再改裝一下,就變形成Silverlight混搭jQuery自動完成的合成獸囉!
操作介面主要構成分為三段,國別、郵遞區號及地址區,當國別為TW時,郵遞區號及地址會啟動自動完成功能。輸入郵遞區號會帶出縣市區域,地址自動完成的部分則有幾種應用方式:
1.輸入前兩個字時,先帶出縣市

2.當縣市確定後,開始提示區域

3.區域也確定時,提示路街名稱

4.若只知縣市跟路名,可以用逗號分隔成"縣市名,路名字首"進行搜尋

5.最後,如果只知道模糊地址,那麼還有星星大法,在不確定的地方補入*,就可使用沒效率的全文檢索

我放了一個Live Demo: http://www.darkthread.net/twaddrhelper/pocdemo.html 給大家試玩,歡迎留言指教。