Avatar billede netroam Nybegynder
06. september 2006 - 13:01 Der er 3 kommentarer og
1 løsning

Vis billede ved select boks

Hej!

Jeg har set utallige steder hvordan man kan få en select boks med options til at vise et bestemt billede, når man vælger en value i select boksen, men jeg vil gerne have en lidt mere avanceret version af den.

Jeg bruger i forvejen select-boksen til at poste en variabel til min MySQL database, så derfor kan jeg IKKE lave en value ved navn billede1.gif f.eks. ... Jeg ønsker derimod at lave det sådan, at hvis man vælger en value, som f.eks. hedder INCO, at et billede så opdateres til filnavn "images/hold/INCO_R.gif". Det samme gør sig gældende hvis valuen er noget andet selvfølgelig.

Udover ovenstående skal det nævnes, at der ikke kun er tale om 1 select boks men derimod x antal select bokse, der genereres ud fra et database-udtræk. Hvor mange der er tale om, er forskelligt fra hver gang, så det skal også tages i betragtning :)

Nogen, der kan være mig behjælpelig?

På forhånd tak!
Avatar billede olebole Juniormester
07. september 2006 - 14:54 #1
<ole>

Jo, du kan godt bruge value:

function foo(val) {
    var a, im = document.getElementById("myPic");
    a = val.split("|");
    im.setAttribute("src", a[0]);
   
    // Gør noget med anden del af værdien her
    alert(a[1]);
}

<img id="myPic" src="bar.jpg" alt="noget">

<select onchange="foo(this.value)">
    <option value="pic1.jpg|bla1">Option 1</option>
    <option value="pic2.jpg|bla2">Option 2</option>
    <option value="pic3.jpg|bla">Option 3</option>
</select>

/mvh
</bole>
Avatar billede netroam Nybegynder
11. september 2006 - 08:07 #2
Nu er det jo sådan, at jeg ikke har en value med en billede-fil, men mere end select boks der ser nogenlunde sådan ud:

<select name="vinder1">
    <option value="INCO">Option 1</option>
    <option value="NYGI">Option 2</option>
</select>

Jeg vil så have billedet ved siden af select boksen til at ændre sig til enten <img src="images/hold/INCO_R.gif"> eller <img src="images/hold/NYGI_R.gif"> afhængig af hvad man vælger i select boksen!

En enkelt problemstilling mere er den, at der hver uge er et variabelt antal select bokse - dvs. der kan være 16 den ene uge, 14 den anden uge osv., men disse bliver genereret hele tiden "on the fly" af PHP med forskellige "names" i select boksene. Er det fortsat noget, der kan lade sig gøre?

/// Morten
Avatar billede netroam Nybegynder
20. september 2006 - 15:14 #3
Never mind ... Jeg har selv hittet ud af det nu! Jeg gjorde blot som følger:

<select name="vinder1" onchange="document.getElementById('vinderLogo1').src='images/hold/logo/'+this.value+'.gif'">
<option value="">Vælg vinder</option>
<option value="INCO">Hold 1</option>
<option value="NYGI">Hold 2</option>

<img src="" name="vinderLogo1" width="40" height="39" alt="">

Ellers mange tak for hjælpen, Ole ... Hvis du vil have lidt af pointsene, så smid et svar - ellers nupper jeg dem selv :)
Avatar billede netroam Nybegynder
25. september 2006 - 09:45 #4
Du kan evt. hjælpe mig med at få det til at virke under Mozilla Firefox ... det ser ikke rigtig ud til at virke i den browser :)
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