Avatar billede loukas Mester
25. juli 2007 - 20:28 Der er 13 kommentarer og
1 løsning

Submitte værdi ved klik på imagemap

Jeg skal have lavet en såkaldt "postnr vælger".
Jeg har fået lavet et imagemap som skifter billede når musen holdes over f.eks. nordjylland bliver området markeret med rødt.
Nu skal det laves sådan at nr der klikkes på nordjylland skal den submitte formularen med værdien nordjylland (name="omraade" value="nordjylland") Så jeg kan hente alle postnumre fra Nordjylland ind i en <select multiple>

Her er en "bid" af imagemappet:
<area shape="rect" coords="71,11,167,104" href="#" onMouseOver="document.mit_billede1.src='../img/DK_kort_nordjylland.jpg';" onClick="submitForm()" onMouseOut="document.mit_billede1.src='../img/DK_kort.jpg';" target="_self" alt="Nordjylland" name="omr" value="nordjylland">

Hvis der skulle være en anden idé til hvordan jeg får postnumre over i <select> vil jeg selvføl'i gerne høre den.
Avatar billede w13 Novice
25. juli 2007 - 20:32 #1
<input id="omraade" type="hidden" name="omraade">

<area shape="rect" coords="71,11,167,104" href="#" onMouseOver="document.mit_billede1.src='../img/DK_kort_nordjylland.jpg';" onClick="document.getElementById('omraade').setAttribute('value','nordjylland')" onMouseOut="document.mit_billede1.src='../img/DK_kort.jpg';" target="_self" alt="Nordjylland" name="omr" value="nordjylland">

evt.?
Avatar billede morten-vadskaer Praktikant
25. juli 2007 - 21:34 #2
w13, formularen bliver da ikke submittet af den løsning, gør den? Jeg er nybegynder udi JavaScript, men skal der ikke tilføjes "; submitForm()" efter "setAttribue('value','nordjylland')"?

Og at få postnumrene over i <select>'en kan du vel gøre med server-side-teknologi, når du alligevel får "Nordjylland" submitted første gang. Kan du ikke, Loukas?
Avatar billede w13 Novice
25. juli 2007 - 21:39 #3
Nåå jeg troede bare, det var en del af din formular, og at du havde en submitknap.

Men så kan du vel gøre det således (helt uden <form>):

<area shape="rect" coords="71,11,167,104" href="#" onMouseOver="document.mit_billede1.src='../img/DK_kort_nordjylland.jpg';" onClick="window.location.href=andenside.asp?omraade='nordjylland'" onMouseOut="document.mit_billede1.src='../img/DK_kort.jpg';" target="_self" alt="Nordjylland" name="omr" value="nordjylland">

Så får du det over på en anden side (i dette tilfælde andenside.asp), hvor du så kan hente querystringen ned i en select, hvis det er det, du vil, med Request.Querystring("omraade").

Det kan også gøres noget smartere med:

<area shape="rect" coords="71,11,167,104" href="#" onMouseOver="document.mit_billede1.src='../img/DK_kort_nordjylland.jpg';" onClick="window.location.href=andenside.asp?omraade=this.getAttribute('alt')" onMouseOut="document.mit_billede1.src='../img/DK_kort.jpg';" target="_self" alt="Nordjylland" name="omr" value="nordjylland">

Så skulle den meget gerne benytte sig af værdien skrevet i "alt"-attributten. På den måde skal du kun skrive den der og ikke rette i onclick-proceduren.
Avatar billede w13 Novice
25. juli 2007 - 21:39 #4
Og "Loukas"? :P
Avatar billede w13 Novice
25. juli 2007 - 21:56 #5
Ah, jeg misforstod lige.. nevermind.. for lidt søvn..
Avatar billede w13 Novice
25. juli 2007 - 21:57 #6
Troede, du var spørgeren..
Avatar billede morten-vadskaer Praktikant
25. juli 2007 - 22:01 #7
Næh w13, jeg er ikke spørgeren. Læser kun med for at lære lidt JavaScript. Jeg kan godt lide din måde at brugte "alt"-attributten på. Kløgtigt tænkt.

Lige nu submitter han jo ikke hele formularen, men tror egentlig heller ikke det er dét, han er interesseret i, så opgaven må vel siges at være løst.
Avatar billede w13 Novice
25. juli 2007 - 22:08 #8
Der manglede dog et par apostroffer omkring linket efter "href=".

<area shape="rect" coords="71,11,167,104" href="#" onMouseOver="document.mit_billede1.src='../img/DK_kort_nordjylland.jpg';" onClick="window.location.href='andenside.asp?omraade='+this.getAttribute('alt')" onMouseOut="document.mit_billede1.src='../img/DK_kort.jpg';" target="_self" alt="Nordjylland" name="omr" value="nordjylland">

Således =)
Avatar billede loukas Mester
25. juli 2007 - 23:00 #9
Hey,
jo den var skam god nok den første, jeg har en function på onclick 'submitForm()'
Så den ser nu således ud og virker.
<area shape="rect" coords="71,11,167,104" href="#" onMouseOver="document.mit_billede1.src='../img/DK_kort_nordjylland.jpg';" onClick="document.getElementById('omraade').setAttribute('value','nordjylland'); submitForm()" onMouseOut="document.mit_billede1.src='../img/DK_kort.jpg';" target="_self" alt="Nordjylland" name="omr" value="nordjylland">

Så hvis du smider et svar w13, kan jeg give points.
Tak for hjælpen!
Avatar billede w13 Novice
25. juli 2007 - 23:27 #10
Et svar her! =)
Avatar billede olebole Juniormester
26. juli 2007 - 12:41 #11
<ole>

value="nordjylland" ... den holder da ikke på et map-area  =)

/mvh
</bole>
Avatar billede olebole Juniormester
26. juli 2007 - 12:46 #12
- og name-attributten er forresten heller ikke valid på et area-element  ;o)
Avatar billede w13 Novice
26. juli 2007 - 14:43 #13
Næh, og den bliver vist heller ikke brugt nu, så det kan godt skæres fra.
Avatar billede loukas Mester
26. juli 2007 - 17:26 #14
Nej, jeg skal nok få den fjernet. ;-)
Tak
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