Ajax Drag Panel Extender

Drag Panel Extender

Drag panel Extender is used to allow the user to dynamically drag a panel on the page It has two important properties targetControlID &  DraghandleId where DraghandleID is used to specify ID of the control by clicking on which the target control can be dragged.

While using Dragpanel Extender you must enclosed in a div tag in which the height property of style set to the required value within which the target control can be dragged


The following example Demonstrate how to use a drag panel extender.

Add ‘a’ page to the website and place a Toolkit script manager and a panel on that page and within the panel take a label with the caption “click Here TO Drag” and next to the label provide any content within the panel.

Within HTML source of the page drag and drop DragpanelExtender and set the following properties to it by enclosing it in a Div tag as follows.

<div style = “height : 600px”>

<asp:DragpanelExtender Id=”DragPanelExtender1” runat=”server” TargetcontrolID= “panel1” DragHandleID =’Label1’>

</asp: DragPanelExtender> </div>

At runtime by clicking on the label caption ‘click Here to Drag’ you can drag the panel to anywhere within an area of 600 px.