示範如何以非同步AJAX方式訪問SharePoint資料

很多人都希望在SharePoint頁面上能讓某個部分能"局部重新整理"，也就是說，這個部分的內容在重新整理的時候，不會造成整個頁面的Postback。為了快速示範大致的實現方法，在周末的時候做了一個用來示範的項目，它實現的功能很簡單：

1、提供給使用者一個下拉框，列出當前網站所有的文件庫，使用者可以選擇一個文件庫，並載入此文件庫的檔案夾架構。
2、檔案夾結構通過一個TreeView來進行展現。
3、當使用者在TreeView上點擊一個檔案夾節點時，將檔案夾所包含的檔案顯示在一個Grid Table中。
4、在Grid Table中，包括了分頁、排序、搜尋等功能。
5、上面的所有從SharePoint系統中載入資料的操作，都不會引發頁面重新整理，而是通過非同步AJAX方式從SharePoint系統中擷取所需的資料。載入資料的過程中，使用者的頁面操作不會被打斷。

這個示範的實現思路大致如下：

1、為了能讓SharePoint系統對外發布所需的資料，需要在伺服器上建立幾個定製的介面。雖然SharePoint內建了Web Services介面，但其中不一定會包含我們所需的介面方法。在這個示範中，為了簡單起見，我直接建立了幾個.ashx Http Handler，用戶端的代碼可以通過直接存取這幾個.ashx檔案，來調用伺服器端的介面。

2、這幾個.ashx檔案會以JSON格式純文字方式，將用戶端請求的資料返回。選擇JSON格式的理由是，它足夠簡單且通用，在這裡示範的情境中，其表現力足夠用了。另外一個選擇JSON的理由是，我打算在頁面上使用jQuery來調用伺服器端的介面，而jQuery對JSON格式的資料有很好的處理能力。

3、用戶端頁面上的展現，沒有建立自訂Web Part，而是用HTML + JS的方式，來訪問伺服器端的服務介面，擷取到所需資料，並將介面呈現給使用者。簡單來說，就是AJAX啦。我選擇使用jQuery，並利用了jQuery非同步AJAX的能力，實現非同步請求、無重新整理、不阻塞使用者頁面操作的效果。

4、為了方便快速的實現TreeView、Grid Table、Dialog等介面效果，我直接找了三個jQuery外掛程式：TreeView、DataTables和FancyBox。

為了協助大家更容易瞭解這些思路，我錄了一個簡短的視頻。

下載WMV格式視頻
下載示範項目源碼

在SharePoint 2010中，其內建提供的Client OM包含了ECMAScript(JavaScript)類庫，這樣開發人員可以直接使用這些類庫，通過頁面指令碼的方式訪問SharePoint 2010網站資料。

Enjoy SharePoint !