ASP.NET 3.5 and above only

ASP.NET TreeView -Customized Drag and drop

Visual drag style is customized as like Vista theme. Refer the code snippets for more details...

  • Local Disk (C:)
    • Documents and Settings
      • All Users
      • Guest
      • Home
    • oboutSuite
      • AJAX Page
      • App_Code
      • App_Data
      • Bin
      • ComboBox
      • Grid
      • TreeView
    • Program Files
      • Common Files
      • Internet Explorer
      • Microsoft
[JavaScript]

            //ASP.NET AJAX event is triggered when the page is loaded
            function pageLoad(sender, args) {
                //Override default visual drag element implementation method
                ObTreeDragDropHandler._createDragEle = function () {
                    var container = ObTreeDragDropHandler.dragVisual = document.createElement("div");

                    var img = document.createElement("IMG");
                    img.src = "img/dragEle.png";
                    img.style.height = "107px";
                    img.style.width = "107px";
                    setOpacity(img, 5);

                    var msg = document.createElement("div");
                    msg.className = 'message';
                    var msg_img = document.createElement("IMG");
                    msg_img.src = "img/allow.png";
                    msg.appendChild(msg_img);
                    var msg_span = document.createElement("SPAN");
                    msg.appendChild(msg_span);

                    container.className = ObTreeDragDropHandler.owner.element.className;

                    OboutHelper.addToClassName(container, "customDrag");

                    container.style.display = "none";
                    container.appendChild(img);
                    container.appendChild(msg);
                    document.body.appendChild(container);
                }
            }
            //'OnNodeDrag' Event defined in obout TreeView
            function ClientOnNodeDrag(sender, args) {
                var msg = ObTreeDragDropHandler.dragVisual.childNodes<1];
                var parent = args.target.parentNode;
                if (parent != null  && sender.isNode(parent)) {
                    msg.style.display = 'block';
                    if (sender.isDropDisabled(parent) || args.sourceNode == parent) {
                        msg.childNodes<0].src = "img/deny.png";
                        msg.childNodes<1].innerHTML = "Cannot move to " + sender.getNodeText(parent);
                    }
                    else {
                        msg.childNodes<0].src = "img/allow.png";
                        msg.childNodes<1].innerHTML = "Move to " + sender.getNodeText(parent);
                    }

                }
                else {
                    msg.style.display = 'none';
                }
            }
            

"I just discovered your control suite by accident and, after looking at your online demos, I was so impressed that I couldn't resist the temptation to download and put it through its paces. After several hours of experimentation, I congratulate you on a really great product. Your controls are well designed, robust and performance."

Tim Coulter

Random testimonial   All testimonials