不過這篇文章的題目我真不知道該怎麼起,如果你因為這個差勁的題目錯過這個東西,那真的很可惜。
我在做這個東西之前參考了不少文章:
http://www.roseindia.net/tutorials/json/parse-message-JSON-JS.shtml
http://www.json.org/js.html
http://funkatron.com/site/comments/safely-parsing-json-in-javascript/
http://docs.jquery.com/Ajax/jQuery.getJSON
http://encosia.com/2009/06/29/never-worry-about-asp-net-ajaxs-d-again/
http://encosia.com/2009/04/07/using-complex-types-to-make-calling-services-less-complex/
http://www.isolutionteam.co.uk/json-jquery-ajax-aspnet-and-c-to-get-ajaxed-data-table-rows-passing-multiple-parameters/
第一步需要做的是如何在Server端把一個datatable轉壞為自己需要的那種格式:
本來想使用.net的javascriptSerializer來完成的(結合Genirics庫的List等),但是後來發現使用NewtonSoft.Json更加靈活,而且擴展性比較好,甚至在網上有找到一些代碼能夠現成使用。
先看看我在Server端如何實現了Data轉化:
這裡不僅能夠轉換Datatable還有DataSet,以後再擴展JavascriptSerializer的轉換功能。需要注意的是轉化的最終結果需要是個[]包著的一段字符串.開始我試著使用{}來最終返回json為對象,結果在客戶端真的是沒有頭緒根本就無法轉換。最後看到一篇文章介紹,在.net 3.5中你的web Services返回來的結果會自動打包成一個json對象,且名字為d,如:{“d”:***}.所以我只有在服務器端的生成一個array形式的包。
然後我創建了一個數據庫表,內容如下:
,
定義的web方法如下:
Serializer方法已經在DNA_JSON中打包好。它是在NewtonSoft.Json的基礎轉換類基礎上擴展的。
第二步是客戶端的東西:
首先我們需要用到幾個js, jQuery.js, json2.js就OK了。
上面圖所示我們用到了jQuery的ajax和JSON。Parse()轉換函數。
還有需要注意的是res.d它是.net 3.5默認為你打包好的json的屬性。如果你使用framework2.0就沒有這個問題了。
最後是看看如何把這些ojbect組成的array顯示在一個table中,代碼如下:
代碼如下: