承接上篇
到了這邊,Tree就能夠順利的長出來了
再來,開始撰寫變更ParentId的程式碼
維護後,因為架構已經變更,因此要把樹清掉,再重新用新的架構長一次
Private Sub MoveNode(ByVal NodeId As Integer, ByVal ParentId As Integer)
'自己不能是自己底下,不能搬根目錄
If NodeId <> ParentId And NodeId <> 1 Then
Using Conn As New SqlConnection(ConfigurationManager.ConnectionStrings("MyTestConnStr").ConnectionString)
Dim SqlTxt As String = ""
'設定改ParentId的SQL語法
SqlTxt += " UPDATE tTree "
SqlTxt += " SET ParentId = @ParentId "
SqlTxt += " WHERE NodeId = @NodeId "
SqlTxt += " "
Using Cmmd As New SqlCommand(SqlTxt, Conn)
Cmmd.Parameters.AddWithValue("@ParentId", ParentId)
Cmmd.Parameters.AddWithValue("@NodeId", NodeId)
Conn.Open()
Cmmd.ExecuteNonQuery()
'更改後,清除TreeView節點,並重新建立樹結構
Me.TreeView1.Nodes.Clear()
Dt = GetDataTable()
InitTree(Me.TreeView1)
BuildTree(Me.TreeView1)
'全部展開
Me.TreeView1.ExpandAll()
End Using
End Using
End If
End Sub
接著就是呼叫Server端的事件來呼叫MoveNode
Protected Sub lbChg_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles lbChg.Click
Me.lblMsg.Text = Me.txtNodeId.Text & "搬到" & Me.txtParentId.Text & "底下"
If Me.txtNodeId.Text <> "" And Me.txtParentId.Text <> "" Then
'如果節點代號、父節點代號有,才運作
Dim NodeId As Integer = CType(Me.txtNodeId.Text, Integer)
Dim ParentId As Integer = CType(Me.txtParentId.Text, Integer)
'呼叫般移節點
MoveNode(NodeId, ParentId)
Else
Me.lblMsg.Text = "必須要有NodeId與ParentId"
End If
End Sub
話說,要拖拉,還是把拖拉的節點名稱顯示在滑鼠游標旁邊比較有Fu…所以小喵再次修改了一下,看一下運作後的效果先!!
http://www.youtube.com/watch?v=ULPWaPo2zsc&feature=player_embedded
改的地方並不多,首先在畫面上多幾個物件來紀錄,分別是
txtNodeText:紀錄節點的內容
Hidden1:紀錄拖拉的狀態
spanNode:用以顯示在滑鼠旁邊的東西
<asp:TextBox ID="txtNodeText" runat="server"></asp:TextBox>
<span id="spanNode" style=""></span>
<input id="Hidden1" type="text" value="0" />
接著,修改一下檢點【MouseDown】與【MouseUp】事件中,多紀錄這些內容,寫在CodeFile的PageLoad裡面
'撰寫Client端事件,節點的MouseDown,MouseUp
Dim Script As String = ""
Script += " <script type='text/javascript'>" + vbCrLf
Script += " window.document.select=false; " + vbCrLf
Script += " " + vbCrLf
Script += " function NodeDown(NodeId,NodeText){ " + vbCrLf
Script += " $('#" & Me.txtNodeId.ClientID & "').val(NodeId); " + vbCrLf
Script += " $('#Hidden1').val(1); " + vbCrLf
Script += " $('#" & Me.txtNodeText.ClientID & "').val(NodeText); " + vbCrLf
Script += " $('#spanNode').html(NodeText); " + vbCrLf
Script += " } " + vbCrLf
Script += " function NodeUp(NodeId){ " + vbCrLf
Script += " $('#Hidden1').val(0); " + vbCrLf
Script += " alert('xx'); " + vbCrLf
Script += " $('#" & Me.txtParentId.ClientID & "').val(NodeId); " + vbCrLf
Script += " var nid=$('#" & Me.txtNodeId.ClientID & "').val(); " + vbCrLf
Script += " var pid=NodeId; " + vbCrLf
Script += " if(nid!=pid){ " + vbCrLf
Script += " if(window.confirm('您確定要將節點(' + nid + ')搬到節點(' + pid + ')底下嗎??')) " + vbCrLf
Script += " { " + vbCrLf
Script += " //alert('yes' + pid); " + vbCrLf
'借用LinkButton的PostBack來運作
Script += " __doPostBack('" & Me.lbChg.ClientID & "',''); " + vbCrLf
Script += " } " + vbCrLf
Script += " } " + vbCrLf
Script += " " + vbCrLf
Script += " } " + vbCrLf
Script += " </script> " + vbCrLf
另外就是,當進行拖拉的時候(MouseMove),顯示節點文字並跟隨滑鼠游標,這部分寫在aspx中的<Script>裡面囉
<script type="text/javascript">
$(document).ready(function() {
$(document).mousemove(function(e) {
//檢查是否在拖拉狀態
if ($('#Hidden1').val() == 1) {
//拖拉中,設定顯示位置
var sp = $('#spanNode');
sp.css({position:'absolute',left:e.clientX, top:e.clientY});
}
else {
$('#spanNode').html('');
}
});
})
</script>
而拖拉的範圍是整個Document,所以寫在Document的mousemove事件中
詳細完整的程式碼請點選下面下載
http://demo.dotblogs.com.tw/topcat/sample/MoveTreeNode/tTreeView2.zip