-1

I have the following situation: two lists and two buttons and I want to click on a button and send a list1 field to list2, and vice versa

HTML:

<!DOCTYPE HTML>
<html lan="en">
<head>
 <meta charset="utf-8" />
 <title>Liste</title>
 <link rel="stylesheet" type="text/CSS" href="liste.css" />
 <script type="text/Javascript" src="Liste.js"></script>
</head>
<body>
<select id="Box" size=6>
 <option value="R6">Yamaha R6</option>
 <option value="R1">Yamaha R1</option>
</select>
<input type="button" id="bouton_Envoyer" value="Send>>>" onclick="Send()">
<input type="button" id="bouton_Envoyer" value="Delete<<<">
<select id="Box2" size=6>
  <option></option>
</select>
</body>
</html>

JS:

function Send ()
{
 var x = document.getElementById("Box");
 var Select_value = x.options[x.selectedIndex].text;
}

I can select an item but I don't know how to send it to the other list.

Jon Miles
  • 9,605
  • 11
  • 46
  • 66

1 Answers1

0

You need to create a new <option> DOM element and append it to Box2.

<select id="Box" size="6">
 <option value="R6">Yamaha R6</option>
 <option value="R1">Yamaha R1</option>
</select>
<input type="button" id="bouton_Envoyer" value="Send>>>" onclick="Send()">
<input type="button" id="bouton_Envoyer" value="Delete<<<">
<select id="Box2" size="6">
  <option></option>
</select>

Script:

function Send ()
{
    var x = document.getElementById("Box");
    var Select_value = x.options[x.selectedIndex].text;

     var newOpt = document.createElement('option');
     newOpt.innerHTML = Select_value;
     document.getElementById('Box2').appendChild(newOpt);
}

Fiddle: http://jsfiddle.net/5vuvT/