move and copy select element in textbox [Archive]

View Full Version : move and copy select element in textbox

chitra

07-20-2005, 06:03 AM

Thanks in adv.
I have seen both the links.But my requirement is I am having Select option which contains list of options like
<select>
<option>List1</option>
<option>List2</option>
<option>List3</option>
</select>

and 2 textboxes

<INPUT ID="Text1" value="">
<INPUT ID="Text2" value="">

Now I want to do coding such as I will select List1 and drag and drop(copy) it either in "Text1" or "Text2".

Can u tell me how to do that in Java script.I have got some code from internet for the same.But it is not working.Can u tell me what is missing in the following code:

<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() {
var txt1;
txt1=document.getElementbyID('oSource').innerText;
event.dataTransfer.setData("Text", txt1);
event.dataTransfer.effectAllowed = "copy";
}

/* ----------------------------------------------
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 = "copy";
oTarget.value = event.dataTransfer.getData("Text");
}

/* ----------------------------------------------
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 = "copy";
}

function onmouseselect()
{
document.getElementbyID('oSource').innerText ;
}
</SCRIPT>
</HEAD>
<BODY>

<P>Drag and drop it onto the text box below. Text data will be pasted into the text box.</P>

<select id="oSource" ondragenter="fnSetInfo()" >
<option>List1</option>
<option>List2</option>
<option>List3</option>
</select>

<INPUT ID=oTarget VALUE="sdf"
ondragenter="fnCancelDefault()"
ondrop="fnGetInfo()"
ondragover="fnCancelDefault()">

</BODY>

tundama

08-14-2007, 06:16 AM

Can some one give me an idea how can I copy a dropdownlist form 1 panel to another in the same page?

jscheuer1

08-14-2007, 07:47 AM

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function copy(n,t){
t.appendChild(n.cloneNode(true));
}
</script>
</head>
<body>
<form action="#">
<select name="bob">
<option value="">Hi</option>
<option value="">There</option>
</select>
</form>
<form action="#">
<input type="button" onclick="copy(document.forms[0]['bob'], this.form);" value="Copy"><br>
</form>
</body>
</html>

tundama

08-14-2007, 10:46 AM

I have 2 dropdownlists the value in the second DDL depends on the first one,
The second DDL has all the values combined - but when I choose an item in the 1st DDL the items in the 2nd DDL are filtered so that only values coresponding the 1st DDL are shown

this is what I have:

1st DDL: <option value="30196">ITEM 1</option>
<option value="1016535">ITEM 2</option>
<option value="1016568">ITEM 3</option>

2nd DDL :<option value="30145|1090001">SItem1</option>
<option value="30196|2">SItem2</option>
<option value="30196|1090001">SItem3</option>
<option value="30196|1090002">SItem4</option>
<option value="30196|1090003">SItem5</option>
<option value="30198|1090001">SItem6</option>
<option value="30260|1090001">SItem7</option>
<option value="40060|1090001">SItem8</option>
<option value="40086|1090001">SItem9</option>
<option value="40087|1090001">SItem10</option>
<option value="1015018|3">SItem11</option>

so when I choose ITEM1 in 1st DDL all the corresponding items are shown in the 2nd DDL which contain value 30196