AjaxTreeView的應用下文將要介紹的是一組可以實現動畫效果的.docVIP

AjaxTreeView的應用 下文將要介紹的是一組可以實現動畫效果的TreeView元件。它將會以Show Modal Panel的方式，打開新增和修改畫面。 準備工作 在進入具體設計之前，先需要將例子中使用的Table [AREA]（場地）進行創建。其中，pid作為key，areaname（場地名稱）將作為TreeView上的每個Node的Caption，parent作為parent node標記欄位，里面填入parent node的key值。如果為根目錄，則parent為空值。 CREATE TABLE [dbo].[AREA]( [pid] [int] NOT NULL, [areaname] [nvarchar](80) NULL, [parent] [int] NULL, primary key (pid) ) insert into AREA values(0, 場地管理, null) insert into AREA values(1, 會議室, 0) insert into AREA values(2, 會客室, 0) insert into AREA values(3, 專案區, 0) insert into AREA values(4, 大會議室, 1) insert into AREA values(5, 小會議室, 1) 實例開發 Server端設計 使用Wizard將準備工作中創建的Table設計一個Server端，並將該Server工程命名為sAREA。 最後將建置成功的sAREA的dll文件掛入EEPNetServer - Package Manager中。 Client端設計 透過Wizard使用WSingle1作為Template，生成一個名為bAREA.aspx，將其生成在MyWeb的目錄下，同時選擇sAREA的Server工程，作為資料來源。 在page上右擊滑鼠，點選View Component Designer，將畫面中的WMaster （即WebDataSet）的AlwaysClose屬性設定為False。同時，選中WMaster後，右擊滑鼠選擇Save選項。 刪除Page上的WebFormView1和WebTraslate1，同時貼入一個ScriptManager，UpdatePanel，TreeView，AjaxTreeViewPopup以及作為新增、修改、刪除的三個Button（btInsert，btUpdate和btDelete） 請注意: 此處的TreeView為VS的原生元件，此元件在ToolBoxs-Navigation中。 接著，我們找到AjaxTreeViewPopup元件，對它的屬性進行設定。在以往的Srvtools中的WebTreeView的設計，是通過WebTreeView自生的DataSrouceID，TextField，KeyField及ParentField的設定來完成TreeView的數據源的讀取。為了能夠實現Show Modal Panel的方式進行新增、修改TreeView，因此上述的這些屬性將在AjaxTreeViewPopup中設定。 DataSrouceID: TreeView的數據源ID。此處設定值: Master。 TextField: TreeView每個節點顯示的內容欄位。此處設定值: areaname。 KeyField: TreeView每個節點的Key欄位。此處設定值: pid。 ParentField: TreeView用于區分節點間關系欄位。此處設定值: parent。 TreeViewId: AjaxTreeViewPopup所對應的TreeView的ID。此處設定值: TreeView1。 UpdatePanelID: 設定TreeView所在的UpdatePanel。此處設定值: UpdatePanel1。 InsertButtonId: 設定控制TreeView新增的Button。此處設定值: btInsert。 UpdateButtonId: 設定控制TreeView修改的Button。此處設定值: btUpdate。 TreeView除了有默認顯示樣式外，還可以通過Format的設定來變換顯示風格。選中TreeView後，選擇右上角的小三角，選擇Auto Format就可以設定格式。這里我們選擇Inbox風格。 接著，對TreeView添加SelectedNodeChanged事件。此時機的作用是為了能夠在TreeView變換選擇node時，能夠將選中的node記錄下來，以便在修改或新增的情況下，使用的ModalPanel可以