---
title: "Två multiselect och flytta objekt mellan dem."
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/165647-två-multiselect-och-flytta-objekt-mellan-dem"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "UrMe"
published: "2007-10-19T14:48:50.000Z"
updated: "2007-10-26T07:53:01.000Z"
replies: 7
views: 677
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/165647-två-multiselect-och-flytta-objekt-mellan-dem"
---

# Två multiselect och flytta objekt mellan dem.

## #1 — UrMe, 2007-10-19T14:48Z

Jag har två multiselect som ser ut ungefär så här:

```php
<select MULTIPLE size="5" class="multisel1" name="groups_ava" id="groups_ava">
<option value="34">Val1</option>
<option value="12">Val2</option>
<option value="110">Val3</option>
</select>

<select MULTIPLE size="5" class="multisel1" name="groups_sel" id="groups_sel">
<option value="99">Val4</option>
<option value="123">Val5</option>
<option value="321">Val6</option>
</select>

<input type="submit" id="btnAddGroup" name="btnAddGroup" class="submit2" onclick="javascript:move(1);" value="&raquo;&raquo;">
<input type="submit" id="btnDelGroup" name="btnDelGroup" class="submit2" onclick="javascript:move(2);" value="&laquo;&laquo;">
```

Det jag vill göra är att t.ex flytta över Val1 till den andra selecten, och sedan när man trycker "Send" eller nåt skicka arrayen med de sakerna som ligger i "groups_sel".

Hur ska jag bära mig åt med javascriptet, är helt still i huvudet :((
Jag laddar in sakerna i "groups_ava" från en databas men det ska väl inte spela någon roll.

Permalänk: https://www.webforum.nu/p/165647

## #2 — Peter S, 2007-10-20T19:17Z

Ett exempel hittar du [här](http://www.webforum.nu/showthread.php?t=63751).

Permalänk: https://www.webforum.nu/p/2043238

## #3 — UrMe, 2007-10-22T07:04Z

> **Peter S skrev:**
>
> Ett exempel hittar du [här](http://www.webforum.nu/showthread.php?t=63751).

Tackar! Ska kolla på den

Permalänk: https://www.webforum.nu/p/2043543

## #4 — UrMe, 2007-10-23T06:45Z

Skriver en följdfråga här, det är så att jag fick till det precis som jag ville ha det.
Men när man fyllt i formuläret och klickar skicka så vill jag att alla saker i "box2" ska flyttas tillbaka till "box1", det fungerar så där bra... den flyttar ett par av sakerna men inte alla.

Så här ser just koden ut för att flytta tillbaka sakerna:

```php
		if(document.getElementById('cleargroups').checked == true) {
			var dest = document.getElementById('box1');
			var src = document.getElementById('box2');
			var newOption;
			for (var i=0; i < src.options.length; i++) {
				newOption = new Option(src.options[i].text, src.options[i].value);
				dest.options[dest.options.length] = newOption;
				src.options[i] = null;
			}
		}
```

Varför flyttas inte alla objekten? :(
Om jag bara har 1 så flyttas den, om jag har 2 så flyttas 1 om jag har 3 så flyttas 2.

Permalänk: https://www.webforum.nu/p/2043729

## #5 — Peter S, 2007-10-23T16:08Z

Testa att ta bort src.options *\= null; och lägga src.options.length = 0; efter loopen.*

Permalänk: https://www.webforum.nu/p/2043858

## #6 — UrMe, 2007-10-24T07:48Z

> **Peter S skrev:**
>
> Testa att ta bort src.options *\= null; och lägga src.options.length = 0; efter loopen.*

Funkade inte riktigt, den rensar allt nu men flyttar bara den första av någon anledning.

Permalänk: https://www.webforum.nu/p/2043996

## #7 — Peter S, 2007-10-24T17:08Z

För mig fungerar det:

```
function f(){
if(document.getElementById('cleargroups').checked == true) { 
            var dest = document.getElementById('box1'); 
            var src = document.getElementById('box2'); 
            var newOption; 
            for (var i=0; i < src.options.length; i++) { 
                newOption = new Option(src.options[i].text, src.options[i].value); 
                dest.options[dest.options.length] = newOption; 
            } 
	    src.options.length = 0;
        } 

}
</script>

<form>
 <select id=box1></select>
 <select id=box2>
  <option>1
  <option>2
  <option>3
 </select>
 <input type=checkbox id=cleargroups>
</form>
<a href="javascript:void f()">Move!</a>
```

Permalänk: https://www.webforum.nu/p/2044099

## #8 — UrMe, 2007-10-26T07:53Z

Nu verkar det fungera, jag hade kvar denna rad:
src.options *\= null;

Som jag tog bort

Tackar!*

Permalänk: https://www.webforum.nu/p/2044433

---

Tråden på webben: https://www.webforum.nu/amne/javascript/165647-två-multiselect-och-flytta-objekt-mellan-dem