<head runat= "Server" >
<title> Untitled page </title>
<script type= "Text/javascript" src= "Js/jquery-1.4.2.min.js" ></script>
<script type= "Text/javascript" >
$ (document). Ready (function () {
//Append the selection to each other
$ (' #add '). Click (function () {
var options=$ (' #select1 option:selected ');
var remove=options.remove ();
Remove.appendto ("#select2");
});
//Add all items to each other
$ (' #addAll '). Click (function () {
var options=$ (' #select1 option ');
var remove=options.remove ();
remove.appendto ("#select2");
});
//Return the selection to each other
$ (' #remove '). Click (function () {
var options=$ (' #select2 option:selected ');
var remove=options.remove ();
remove.appendto ("#select1");
});
//Return all items to each other
$ (' #removeAll '). Click (function () {
var options=$ (' #select2 option ');
var remove=options.remove ();
Remove.appendto ("#select1");
});
});
</script>
</head>
<body>
<form id= "Form1" runat= "Server" >
<div id= "left" >
<select multiple= "multiple" id= "Select1" style= "width:100px;height:160px" >
<option> Options 1</option>
<option> Options 2</option>
<option> Options 3</option>
<option> Options 4</option>
<option> Options 5</option>
</select>
</div>
<div>
<span id= "Add" > Selected items to the right >></span><br/>
<span id= "AddAll" > All add to Right >></span>
</div>
<div id= "right" >
<select multiple= "multiple" id= "Select2" style= "width:100px;height:160px" ></select>
</div>
<div>
<span id= "Remove" ><< selected items to the left </span><br/>
<span id= "RemoveAll" ><< all restores to left </span>
</div>
</form>
</body>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
