Avatar billede 7th Praktikant
30. november 2003 - 04:48 Der er 15 kommentarer og
1 løsning

Onchange - selected = valgte option

Jeg har en select boks.

<select name="test" onchange="location.href='bla'+this.options[this.selectedIndex].value;">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

Hvordan får jeg det lavet således, at den valgte option bliver den selected i select boksen? Altså hvis jeg vælger option 2, så skal den være den selected i select boksen.
Avatar billede dawin_dk Nybegynder
30. november 2003 - 09:37 #1
den som skal være valgt fra start af skal se sådan her ud:
<option value="3" selected>3</option>
Avatar billede roenving Novice
30. november 2003 - 15:48 #2
?-)

Hvis du har valgt den er den vel valgt ?-)
Avatar billede 7th Praktikant
30. november 2003 - 19:32 #3
Ja, og nej ;o) Kommer lige med en uddybende forklaring.

Min select boks bliver genereret i PHP. Select boksen indeholder farver. Alt efter hvilken farve man har valgt i select boksen, så vises et tilsvarende billede. Som default er den første option jo altid den selected i select boksen. Hvis man så vælger en anden farve i select boksen, så sættes location.href = den valgte farve, men den selected er jo fortsat default. Så ville det jo være smart, at den selected så skiftede til den valgte farve, hvis I forstår. Så kan man jo se hvilken farve man har valgt.

Selvfølgelig kunne man nemt lave det i PHP via forspørgsel på $_GET['variabel'], men hvis det kunne laves smart i javascript, ville det jo være lidt nemmere.
Avatar billede roenving Novice
30. november 2003 - 19:39 #4
Er stadig ikke helt med, men kan du sige forskellen til dette:
'
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Vælg selected</title>
<meta name="keywords" content="søgeord adskilt af komma">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<form id="minForm" name="minForm"><br><br>
<select name="minSelect" id="minSelect" onchange="this.form.style.background=this.value;">
    <option value="">-- Vælg her --<br>
    <option value="red">rød<br>
    <option value="blue">blå<br>
    <option value="green">grøn<br>
</select><br><br>
</form>
</body>
</html>
Avatar billede dawin_dk Nybegynder
30. november 2003 - 19:39 #5
lav det serverside... så er du fri for at folks browsere fucker :)
Avatar billede 7th Praktikant
30. november 2003 - 19:48 #6
Så prøv denne...

test.htm
--------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Vælg selected</title>
<meta name="keywords" content="søgeord adskilt af komma">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<form id="minForm" name="minForm"><br><br>
<select name="minSelect" id="minSelect" onchange="location.href='test.htm?color='+this.options[this.selectedIndex].value;">
    <option value="">-- Vælg her --<br>
    <option value="red">rød<br>
    <option value="blue">blå<br>
    <option value="green">grøn<br>
</select><br><br>
</form>
</body>
</html>
Avatar billede roenving Novice
30. november 2003 - 19:50 #7
Hvis du loader en ny side, kender den selvfølgelig ikke valget ...

-- så skal vi enten over i noget cookie-noget, eller også skal parameteren med i url'en !-)
Avatar billede 7th Praktikant
30. november 2003 - 19:53 #8
Jep det er jo klart, og så kommer vi til mit spørgsmål. Kan man lave det nemt og smart i javascript, så den kan komme til at kende den vilkårlige valgte :o)
Avatar billede roenving Novice
30. november 2003 - 19:58 #9
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Vælg selected</title>
<meta name="keywords" content="søgeord adskilt af komma">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body onload="document.minForm.minSelect.selectedIndex=+location.search.substring(location.search.indexOf('sel=')+4);">
<form id="minForm" name="minForm"><br><br>
<select name="minSelect" id="minSelect" onchange="location.href='test.htm?color='+this.options[this.selectedIndex].value+';sel='+this.selectedIndex;">
    <option value="">-- Vælg her --<br>
    <option value="red">rød<br>
    <option value="blue">blå<br>
    <option value="green">grøn<br>
</select><br><br>
</form>
</body>
</html>
Avatar billede 7th Praktikant
30. november 2003 - 20:05 #10
OK, tak, kigger lige på det.
Avatar billede 7th Praktikant
30. november 2003 - 20:33 #11
Nah, det er lidt for meget at gøre ud af det, men smid bare et svar alligevel :)
Avatar billede roenving Novice
30. november 2003 - 20:40 #12
oki '-)
Avatar billede 7th Praktikant
30. november 2003 - 20:46 #13
Jeg har lige et lille tillægsspørgsmål, som du måske kan svare på. Hvordan får jeg select bokse til at fylde lige meget i alle browsere? Jeg har sat denne style på select.

select {
background-color: #ffffff;
border: 1px solid #abac82;
color: #000000;
font-family: tahoma, verdana, sans-serif;
font-size: 11px;
margin: 0px;
padding: 0px;
}
Avatar billede roenving Novice
30. november 2003 - 20:52 #14
width:150px;
Avatar billede 7th Praktikant
30. november 2003 - 20:59 #15
Hov, width er defineret i en style på hver select boks.

Det var mig som har målt forkert :o) Tak for hjælpen.
Avatar billede roenving Novice
30. november 2003 - 21:00 #16
-- og tak for points ;~}
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester