---
title: "Söka i listbox"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/150008-söka-i-listbox"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "whistler"
published: "2006-08-13T01:04:17.000Z"
updated: "2006-08-15T21:55:49.000Z"
replies: 5
views: 448
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/150008-söka-i-listbox"
---

# Söka i listbox

## #1 — whistler, 2006-08-13T01:04Z

Jag har en listbox med städer, och när jag väljer en stad så ska de människor som bor i staden listas i en annan listbox och vara valbara (utan att sidan laddas om).

Jag tänker mig att man lagrar städer och människor i en array eller motsvarande, men jag vet inte riktigt hur jag ska lösa det.

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

## #2 — The_Hulk, 2006-08-13T08:05Z

Kommer inte ihåg hur man gjorde så att selectboxarna blev många rader men att man bara kunde välja en av raderna. Nu blev det många rader man man kan välja många rader samtidigt men grunden har du iaf.

```
<html>
    <head>
        <script>
            var aFirst = new Array("aaaa", "bbbb", "cccc", "dddd", "eeee", "ffff", "gggg", "hhhh");
            var aSecond = new Array(
                new Array("a1", "a2", "a3", "a4", "a5"),
                new Array("b1", "b2", "b3", "b4"),
                new Array("c1", "c2", "c3", "c4"),
                new Array("d1", "d2", "d3", "d4"),
                new Array("e1", "e2", "e3", "e4"),
                new Array("f1", "f2", "f3", "f4"),
                new Array("g1", "g2", "g3", "g4"),
                new Array("h1", "h2", "h3", "h4")
            );
            
            function fn_init()
            {
                var oBox = document.getElementById('box1');

                if(oBox != null)
                {
                    try
                    {
                        for(var i=0; i<aFirst.length; ++i)
                        {
                            oBox.options[i] = new Option(aFirst[i], i);
                        }
                    }
                    catch(ex)
                    {
                        alert(ex.message + ex.description);
                    }
                }
                else
                {
                    alert("Kunde inte hitta 'box1'.");
                }
            }
            
            function fn_show(ind)
            {
                var oBox = document.getElementById('box2');

                if(oBox != null)
                {
                    try
                    {
                        for(var i=0; i<aSecond[ind].length; ++i)
                        {
                            oBox.options[i]=null
                        }
                        
                        for(var i=0; i<aSecond[ind].length; ++i)
                        {
                            oBox.options[i] = new Option(aSecond[ind][i], i);
                        }
                    }
                    catch(ex)
                    {
                        alert(ex.message + ex.description);
                    }
                }
                else
                {
                    alert("Kunde inte hitta 'box1'.");
                }
            }
        </script>
    </head>
    
    <body onLoad="fn_init();">
        <form>
            <select multiple id="box1" style="width: 200px; height: 200px;" onChange="fn_show(this.value);">
            </select>
            <select multiple id="box2" style="width: 200px; height: 200px;">
            </select>
        </form>
    </body>
</html>
```

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

## #3 — whistler, 2006-08-13T23:25Z

tack

jag kanske glömde att säga att de värden som ska visas i array B (dvs, människor) har ett ID som måste skickas med i stil med detta
\<option value="1"\>Arne\</option\>
vilket inte riktigt fungerar med din lösning eftersom du inte använder vanliga selectbox. någon som vet hur man löser det?

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

## #4 — whistler, 2006-08-15T13:49Z

ingen?

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

## #5 — jawbreaker, 2006-08-15T14:04Z

```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="se" lang="se">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Städer och människor</title>

<script type="text/javascript">
<!--

function Person(p_id, p_name, p_city)
{
	this.id = p_id;
	this.name = p_name;
	this.city = p_city;
}

var g_p = new Array();
g_p[0] = new Person(1, "Jan Banan", 1);
g_p[1] = new Person(2, "Pelle Apelsin", 1);
g_p[2] = new Person(3, "Nisse Hult", 2);
g_p[3] = new Person(4, "Kalle Kula", 2);

function loadPersons(p_city)
{
	var obj = document.getElementById("person");
	obj.length = 1;

	for (var i = 0; i < g_p.length; i++)
	{
		if (g_p[i].city == p_city)
			obj.options[obj.length] = new Option(g_p[i].name, g_p[i].id);
	}
}

//-->
</script>
</head>

<body>

<select id="city" name="city" onchange="loadPersons(this.options[this.selectedIndex].value);">
<option value="0">Välj stad</option>
<option value="1">Stockholm</option>
<option value="2">Göteborg</option>
</select>

<select id="person" name="person">
<option value="0">Välj person</option>
</select>

</body>
</html>
```

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

## #6 — whistler, 2006-08-15T21:55Z

wow, tack!

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

---

Tråden på webben: https://www.webforum.nu/amne/javascript/150008-söka-i-listbox
