✔ Formular Aus- und Abwählen

PERFEKT!(!) ;-) genau das was ich gesucht habe!

Vielen herzlichen Dank javaDeveloper2011 (!)

Für alle die was ähnliches vorhaben:

test.php

HTML: 
<html>
<head>
<title>Aus- und Abw&auml;hlen</title>
<script language="JavaScript" type="text/javascript">
<!--
var count1 = 0;
var count2 = 0;

function selektiereAlle() {
    var selectRechts = document.getElementById('selectX2');
    for(var i=0; i<selectRechts.length; i++)   selectRechts.options[i].selected = true;
}


function sortlist() {
    var list = document.getElementById('selectX');
    var values = new Array();
    // Werte in Array speichern
    for(var i=0; i<list.length; i++)  {
        values[i] = list.options[i].value;
    }
    // Array sortieren
    values.sort();
    // Select mit sortierten Werten füllen
    for(var i=0; i<list.length; i++)  {
        list.options[i].value = values[i];
        list.options[i].text = values[i];
    }
	var list = document.getElementById('selectX2');
    var values = new Array();
    // Werte in Array speichern
    for(var i=0; i<list.length; i++)  {
        values[i] = list.options[i].value;
    }
    // Array sortieren
    values.sort();
    // Select mit sortierten Werten füllen
    for(var i=0; i<list.length; i++)  {
        list.options[i].value = values[i];
        list.options[i].text = values[i];
    }
	
	
}
function right(form, selectbox){
    var result = ""; 
    for (var i = 0; i < document.getElementById('selectX').length; i++) { 
        if (document.getElementById('selectX').options[i].selected) { 
			var elOptNew = document.createElement('option');
			elOptNew.text = document.getElementById('selectX').options[i].text;
			elOptNew.value = document.getElementById('selectX').options[i].text;
			var elSel = document.getElementById('selectX2');
			try {
				elSel.add(elOptNew, null); // standards compliant; doesn't work in IE
			}
			catch(ex) {
				elSel.add(elOptNew); // IE only
			}
        } 
    } 
	
	var i;
	for(i=selectbox.options.length-1;i>=0;i--)
		{
			if(selectbox.options[i].selected)
		selectbox.remove(i);
		}
		
		sortlist()

}
function allright(form, selectbox){
	var result = ""; 
    for (var i = 0; i < document.getElementById('selectX').length; i++) {

			var elOptNew = document.createElement('option');
			elOptNew.text = document.getElementById('selectX').options[i].text;
			elOptNew.value = document.getElementById('selectX').options[i].text;
			var elSel = document.getElementById('selectX2');
			try {
				elSel.add(elOptNew, null); // standards compliant; doesn't work in IE
			}
			catch(ex) {
				elSel.add(elOptNew); // IE only
			}

    } 
	
	var i;
	for(i=selectbox.options.length-1;i>=0;i--)
	{
	selectbox.remove(i);
	}
	sortlist()
}
function allleft(form, selectbox){
	var result = ""; 
    for (var i = 0; i < document.getElementById('selectX2').length; i++) {

			var elOptNew = document.createElement('option');
			elOptNew.text = document.getElementById('selectX2').options[i].text;
			elOptNew.value = document.getElementById('selectX2').options[i].text;
			var elSel = document.getElementById('selectX');
			try {
				elSel.add(elOptNew, null); // standards compliant; doesn't work in IE
			}
			catch(ex) {
				elSel.add(elOptNew); // IE only
			}

    } 
	
	var i;
	for(i=selectbox.options.length-1;i>=0;i--)
	{
	selectbox.remove(i);
	}
	sortlist()
}
function left(form, selectbox) { 
    var result = ""; 
    for (var i = 0; i < document.getElementById('selectX2').length; i++) { 
        if (document.getElementById('selectX2').options[i].selected) { 
			var elOptNew = document.createElement('option');
			elOptNew.text = document.getElementById('selectX2').options[i].text;
			elOptNew.value = document.getElementById('selectX2').options[i].text;
			var elSel = document.getElementById('selectX');
			try {
				elSel.add(elOptNew, null); // standards compliant; doesn't work in IE
			}
			catch(ex) {
				elSel.add(elOptNew); // IE only
			}
        } 
    } 
	
var i;
for(i=selectbox.options.length-1;i>=0;i--)
	{
		if(selectbox.options[i].selected)
	selectbox.remove(i);
	}
	sortlist()
} 

//-->
</script>

</head>
<body>
<?php
if(isset($_POST['speichern'])){
	print_r($_POST['selektierte']);
}

?>

<form action="test.php" onsubmit="selektiereAlle();" method="post">
<table>
<tr><th>Vorhandene</<th><th>Optionen</th><th>Ausgew&auml;hlte</th></tr>
<tr><td>
<select id="selectX" name="vorhandene[]" style="width:150px" size="8" multiple="multiple">
<option selected="selected" value="Apfel">Apfel</option>
<option value="Baum">Baum</option>
<option value="Fahrrad">Fahrrad</option>
<option value="Fahrrad3">Fahrrad3</option>
<option value="Himmel">Himmel</option>
<option value="Nase">Nase</option>
<option value="Party">Party</option>
<option value="Sommer">Sommer</option>
<option value="Tanja">Tanja</option>
</select>
</td><td>


<input type="button" onclick="right(this.form, selectX)" style="height: 25px; width: 100px" name="rechts" value="&gt;"><br />
<input type="button" onclick="allright(this.form, selectX)" style="height: 25px; width: 100px" name="alle_rechts" value="&gt;&gt;"><br />
<br />
<input type="button" onclick="allleft(this.form, selectX2)" style="height: 25px; width: 100px" name="alle_links" value="&lt;&lt;"><br />
<input type="button" onclick="left(this.form, selectX2)" style="height: 25px; width: 100px" name="links" value="&lt;" /><br />


</td><td>
<select id="selectX2" name="selektierte[]" style="width:150px" size="8" multiple="multiple">
<option selected="selected" value="Auto">Auto</option>
<option value="Fahrrad2">Fahrrad2</option>
<option value="Hase">Hase</option>
<option value="Hamster">Hamster</option>
</select>

</td></tr>
</table>
<br />
<input type="submit" name="speichern" value="   Speichern   ">
</form>
</body>
</html>
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück