Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations TouchToneTommy on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Anyone know how to do drag and drop?

Status
Not open for further replies.

trueneutral

Programmer
Sep 15, 2003
13
CA
I've heard that it's possible to drag text from one textbox and drop it into another textbox. I've looked for examples on this, and I haven't found anything yet that is helpful. Does anyone know either how to do this, or know of any good examples they could point me to?
 
true: Here's an example from Visual Studio.NET Help in which a text is dragged and dropped into a textbox but from an image to a textbox. You might try and adapt this to two texboxes. Haven't seen a text to text transfer.

Sample

The following example shows the basic code for programming a drag-and-drop operation. This code represents the foundation of a shopping-cart application in which the user drags the icon to the order form and receives textual feedback about the item.

Hide Example

<HEAD>
<SCRIPT>

/* ----------------------------------------------
fnSetInfo sets the data format in the first
parameter and provides the text to drop in second.
The second line copies text.
----------------------------------------------*/

function fnSetInfo() {
event.dataTransfer.setData(&quot;Text&quot;, &quot;Microsoft Golf 1998&quot;);
event.dataTransfer.effectAllowed = &quot;copy&quot;;
}

/* ----------------------------------------------
fnGetInfo is called by the target
object in the ondrop event.
It cancels the default action and
sets the cursor to the system copy icon.
Then it specifies the data format to retrieve.
Last, it sets the value property of oTarget
object to the information from getData.
----------------------------------------------*/

function fnGetInfo() {
event.returnValue = false;
event.dataTransfer.dropEffect = &quot;copy&quot;;
oTarget.value = event.dataTransfer.getData(&quot;Text&quot;);
}

/* ----------------------------------------------
fnCancelDefault
Cancels the default action in ondragenter
and ondragover so that the copy cursor is
displayed until the selection is dropped.
----------------------------------------------*/

function fnCancelDefault() {
event.returnValue = false;
event.dataTransfer.dropEffect = &quot;copy&quot;;
}

</SCRIPT>
</HEAD>
<BODY>
<IMG ID=oSource SRC=&quot;Golf98.gif&quot; ondragstart=&quot;fnSetInfo()&quot;>
<P>Drag the image and drop it onto the text box below. Text data will be pasted into the text box.</P>
<INPUT ID=oTarget VALUE=&quot;[drop text here]&quot;
ondragenter=&quot;fnCancelDefault()&quot;
ondrop=&quot;fnGetInfo()&quot;
ondragover=&quot;fnCancelDefault()&quot;>
</BODY>
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top