實現 ASP.NET 2.0 TreeView 客戶端個性化控制

重寫 TreeView_ToggleNode 實現「全展開/摺疊」與「單一展開」模式

問題

TreeView 伺服器控件客戶端 API 極少，無法直接呼叫全展開/摺疊或互斥展開。

解決思路：腳本重寫

1. 頁面載入兩個 WebResource.axd 腳本，第二個含 TreeView_ToggleNode。
2. 下載腳本分析，TreeView_ToggleNode(data, index, node, lineType, children) 為節點點擊核心邏輯。
3. 在頁面末尾**同名重寫**該函數（JS 後定義覆蓋前定義），在原邏輯後追加個性化行為。

原始 TreeView_ToggleNode 關鍵片段

function TreeView_ToggleNode(data, index, node, lineType, children) {
    var img = node.childNodes[0];
    // ... 判斷 children.style.display 切換展開/摺疊狀態
    // ... 更新 img.src、alt
    data.expandState.value = data.expandState.value.substring(0, index) + newExpandState + data.expandState.value.slice(index + 1);
}

個性化擴充點

• 全展開/摺疊： 遍歷 data.treeNodeList，統一設定 children.style.display 並更新 expandState。
• 單一展開（手風琴）： 展開目標節點前，先遍歷同層節點將 display=none、更新 expandState 為 'c'。

實作建議

• 將重寫腳本放入 .js 檔，ScriptManager 註冊或頁面直接引用。
• 提供伺服器端方法 ExpandAll()/CollapseAll() 同步 expandState 隱藏欄位，確保 PostBack 狀態一致。

此技巧展示如何在不修改組件原始碼前提下，透過腳本重寫擴展內建控件客戶端行為。