Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Jan 2007
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    from one combo box to another

    Hello. I want to do the following. I have a combo box with some phone numbers and i want by clicking on them to move them in a new combo box that is next to it (it is like a phonebook where i choose the phones that i want). My code is the following

    <select name="combo1" size="10" multiple onchange="addme();">
    <option value="1">11111</option>
    <option value="2">22222</option>
    </select>


    <select name="combo2" size="10" multiple >
    </select>

    <script>
    function addme(){
    //document.combo1.options[document.combo1.selectedIndex].value;
    // how can i get all the selected values and append them in the second
    //combo box

    }
    </script>

  • #2
    Regular Coder BonRouge's Avatar
    Join Date
    Mar 2006
    Location
    Sendai, Japan
    Posts
    328
    Thanks
    0
    Thanked 0 Times in 0 Posts
    http://bonrouge.com/demos/move_option.htm

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>move option to another select box</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <style type="text/css">
    * {
    margin:0;
    padding:0;
    }
    body {
    background-color:white;
    }
    select {
    display:block;
    float:left;
    width:5em;
    }
    </style>
    <script type="text/javascript">
    function addme() {
    var numbersBox=document.getElementById('numbers');
    numbersBox.onchange=function() {
    	var picked=this.value;
    	var newOption=document.createElement('option');
    	var text=document.createTextNode(picked);
    	newOption.appendChild(text);
    	newOption.value=picked;
    	document.getElementById('chosen').appendChild(newOption);
    	this.removeChild(this.options[this.selectedIndex]);
    	}
    }
    window.onload=addme;
    </script>
    </head>
    <body>
    <form method="post" action="#">
    <p><select id="numbers" size="10">
    <option value="one">One</option>
    <option value="two">Two</option>
    <option value="three">Three</option>
    <option value="four">Four</option>
    <option value="five">Five</option>
    </select>
    <select id="chosen" size="10"></select></p>
    </form>
    </body>
    </html>

  • #3
    New Coder
    Join Date
    Jan 2007
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks a lot.It works fine


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •