.NET 웹 페이지에 두 개의 TreeView 구성 요소가 있습니다. 한 트리에서 다른 트리로 노드를 드래그 앤 드롭하려고하지만 그 반대는 아닙니다. 또한 특정 수준 (가장 낮은 수준)에서 항목을 끌어다 놓고 특정 수준 (두 번째로 낮은 수준)에 놓기를 원합니다. 끌어서 놓기와 유사한 사용자 지정을 수행하기 위해 Flex에 사용자 지정 코드를 작성했지만 .NET을 처음 사용하는 초보자이며 실제로 여기에 실마리가 없습니다. 누군가 제게 조언 해주세요. 이것은 프로토 타입이므로 기본적인 기능 만 필요하지만 결국이 이동 작업을 위해 데이터를 업데이트하기 위해 데이터베이스에 대한 실시간 호출을 수행하기 위해 이러한 드롭이 필요할 것입니다.두 ComponentOne TreeView 구성 요소간에 드래그 앤 드롭을 사용자 정의 할 수 있습니까?
0
A
답변
1
OnClientNodeDropped
이벤트 처리기를 사용하면 JavaScript에서이를 매우 쉽게 수행 할 수 있습니다. OnClientNodeDragStarted
핸들러를 사용하여 드래그 이벤트가 원하는 레벨이 아닌 경우 취소 할 수 있습니다. 다운로드 가능한 drag and drop treeview sample을 게시했습니다. 아래는 프로젝트의 샘플 코드입니다.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register TagPrefix="cc1" Namespace="C1.Web.UI.Controls.C1TreeView" Assembly="C1.Web.UI.Controls.3" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Treeview Test</title>
<script type="text/javascript" id="ComponentOneClientScript2">
function adminTV_OnClientNodeDropped(sender, eventArgs) {
var dropTarget = eventArgs.get_desObj();
//if drop to the root level.the droptarget is treeview
if (dropTarget == sender) {
eventArgs.set_canceled(true);
return;
}
var node = eventArgs.get_node();
//the other treeview's node can't drop to the admin's.
if (node.get_treeView() != dropTarget.get_treeView()) {
eventArgs.set_canceled(true);
return;
}
//prevent drop the admin's node to the other level.
if (dropTarget.get_level() != 0) {
eventArgs.set_canceled(true);
return;
}
};
function adminTV_OnClientNodeDragStarted(sender, eventArgs) {
//can't drag root node.
if (eventArgs.get_node().get_level() == 0) {
eventArgs.set_canceled(true);
}
};
function userTV_OnClientNodeDropped(sender, eventArgs) {
var dropTarget = eventArgs.get_desObj();
//if drop to the root level.the droptarget is treeview
if (dropTarget == sender) {
eventArgs.set_canceled(true);
return;
}
//prevent drop the node to the other level.
if (dropTarget.get_level() != 0) {
eventArgs.set_canceled(true);
return;
}
};
function userTV_OnClientNodeDragStarted(sender, eventArgs) {
//can't drag root node.
if (eventArgs.get_node().get_level() == 0) {
eventArgs.set_canceled(true);
}
};
</script>
</head>
<body style="font-weight: 700">
<form id="form1" runat="server">
<div>
<asp:ScriptManager runat="server"></asp:ScriptManager>
<cc1:C1TreeView runat="server" ID="adminTV" AllowDragDrop="true"
VisualStyle="ArcticFox" VisualStylePath="~/C1WebControls/VisualStyles"
OnClientNodeDropped="adminTV_OnClientNodeDropped"
onclientnodedragstarted="adminTV_OnClientNodeDragStarted" >
<Nodes>
<cc1:C1TreeViewNode runat="server" Expanded="true" Selected="false" Text="Administrators">
<Nodes>
<cc1:C1TreeViewNode runat="server" Expanded="false" Selected="false" Text="Admin1">
</cc1:C1TreeViewNode>
<cc1:C1TreeViewNode runat="server" Expanded="false" Selected="false" Text="Admin2">
</cc1:C1TreeViewNode>
<cc1:C1TreeViewNode runat="server" Expanded="false" Selected="false" Text="Admin3">
</cc1:C1TreeViewNode>
<cc1:C1TreeViewNode runat="server" Expanded="false" Selected="false" Text="Admin4">
</cc1:C1TreeViewNode>
</Nodes>
</cc1:C1TreeViewNode>
</Nodes>
</cc1:C1TreeView>
<cc1:C1TreeView runat="server" ID="userTV" AllowDragDrop="true"
VisualStyle="ArcticFox" VisualStylePath="~/C1WebControls/VisualStyles"
OnClientNodeDropped="userTV_OnClientNodeDropped"
onclientnodedragstarted="userTV_OnClientNodeDragStarted" >
<Nodes>
<cc1:C1TreeViewNode runat="server" Expanded="True" Selected="False" Text="Users">
<Nodes>
<cc1:C1TreeViewNode runat="server" Expanded="False" Selected="False" Text="User1">
</cc1:C1TreeViewNode>
<cc1:C1TreeViewNode runat="server" Expanded="False" Selected="False" Text="User2">
</cc1:C1TreeViewNode>
<cc1:C1TreeViewNode runat="server" Expanded="False" Selected="False" Text="User3">
</cc1:C1TreeViewNode>
<cc1:C1TreeViewNode runat="server" Expanded="False" Selected="False" Text="User4">
</cc1:C1TreeViewNode>
<cc1:C1TreeViewNode runat="server" Expanded="False" Selected="False" Text="User5">
</cc1:C1TreeViewNode>
<cc1:C1TreeViewNode runat="server" Expanded="False" Selected="False" Text="User6">
</cc1:C1TreeViewNode>
</Nodes>
</cc1:C1TreeViewNode>
</Nodes>
</cc1:C1TreeView>
</div>
</form>
</body>
</html>
관련 문제
- 1. jqueryUI 드래그 앤 드롭을 타블렛과 사용할 수 있습니까?
- 2. 드래그 드롭을 사용한 파일 업로드
- 3. TreeViewer : 드래그 앤 드롭을 사용하여 트리의 요소를 재정렬하거나 자식을 바꿉니다.
- 4. 사용자 정의 위젯 드래그 앤 드롭을 허용하는 winforms 응용 프로그램 만들기
- 5. WPF에서 드래그 앤 드롭을 할 때 mousepoint를 표시
- 6. 드래그 앤 드롭 할 Java 라이브러리가 있습니까
- 7. WPF TreeView 미리보기를 사용한 드래그 앤 드롭
- 8. 마우스 드래그 앤 드롭을 사용하여 실버 라이트 사용자 정의 컨트롤을 디자인하는 방법은 무엇입니까?
- 9. 두 패널간에 모양을 드래그 앤 드롭하는 방법
- 10. 사용자 정의 itemRenderer를 사용하는 AdvancedDataGrid 사이의 드래그 앤 드롭
- 11. ipad 드래그 앤 드롭
- 12. radtreeview에서 드래그 드롭을 사용할 수 없습니다
- 13. jQuery 드래그 앤 드롭을 사용하여 생성 된 표의 순서를 바꿉니다.
- 14. 드래그 앤 드롭 Javascript는 움직이는 마커로 정렬 할 수 있습니까?
- 15. iPad에서 드래그 앤 드롭
- 16. 다른 프로세스간에 드래그 앤 드롭을 구현하는 방법은 무엇입니까?
- 17. Silverlight 4는 앱에서 데스크톱으로 드래그 앤 드롭을 지원합니까?
- 18. TreeView 사용자 정의 노드
- 19. iPad 분할 뷰 앱에서 드래그 앤 드롭을 구현 하시겠습니까?
- 20. android에서 드래그 앤 드롭
- 21. 자바 스크립트에서 비교적 위치가 지정된 요소에 드래그 앤 드롭을 구현하십시오.
- 22. NSTextField에 대해 드래그 앤 드롭을 사용 중지하는 방법은 무엇입니까?
- 23. 드래그 앤 드롭 문제
- 24. Safari 5.1이 HTML 기본 드래그 앤 드롭을 위반 했습니까?
- 25. 안드로이드에서 목록간에 드래그 앤 드롭을 구현하는 방법은 무엇입니까?
- 26. 드래그 앤 드롭을 처리하기 위해 새로운 UIElement에 이벤트를 동적으로 할당합니다.
- 27. 안드로이드 어떻게 목록보기 항목과 드래그 앤 드롭을 수행
- 28. 마우스 이벤트로 드래그 앤 드롭을 복제하는 데 문제가 있습니다.
- 29. Qt : 아이들에게 드래그 앤 드롭을 위임하는 가장 좋은 방법
- 30. 플렉스 드래그 앤 드롭