Avatar billede lesp Nybegynder
04. januar 2008 - 11:23 Der er 23 kommentarer og
1 løsning

Link som knap i form

Hej
Jeg har en CSS-knap som jeg godt kan lide:)
Den vil jeg gerne bruge som 'submit'-knap i en formular.
Koden ser sådan ud:

<div class="buttonwrapper">
<a class="squarebutton" href="#"><span>Submit</span></a> <a class="squarebutton" href="#" style="margin-left: 6px"><span>Reset</span></a>
</div>

Hvordan gør jeg det?
Avatar billede w13 Novice
04. januar 2008 - 11:45 #1
Du lægger bare en onclick på:
onclick="this.form.submit()"
og reset:
onclick="this.form.reset()"

Og hvis this.form ikke finder formen, må du lægge et id på formen og bruge:
onclick="document.getElementById("formens-id").submit()/.reset()"
Avatar billede lesp Nybegynder
04. januar 2008 - 14:50 #2
Så det kommer til at se sådan ud?

<div class="buttonwrapper">
<a class="squarebutton" href="#" onclick="this.form.submit()"><span>Submit</span></a> <a class="squarebutton" href="#" style="margin-left: 6px" onclick="this.form.reset()"><span>Reset</span></a>
</div>
Avatar billede w13 Novice
04. januar 2008 - 14:51 #3
Jep. Men "this.form" kræver, at de så ligger inde i en form, der har en "action"-attribut.

Hvis man da overhovedet kan bruge this.form på et link.
Avatar billede lesp Nybegynder
04. januar 2008 - 14:57 #4
Ja. Så den kode overtager altså funktionen som "submit" og "reset" hvis de ligger i en form?
Avatar billede w13 Novice
04. januar 2008 - 14:59 #5
Teoretisk set, ja :P Dvs. det burde den efter mit hoved! Har tit før brugt this.form.submit(), bare ikke lige sådan her.
Avatar billede lesp Nybegynder
04. januar 2008 - 20:18 #6
Nåh, men det har jeg så testet.

Min knap ser nu sådan ud:

<div class='buttonwrapper'>
<a class='squarebutton' href='#' onclick='this.form.submit()'><span>Submit</span></a></div>

Det virker ikke. Man bliver ikke sendt videre til "action".
Avatar billede w13 Novice
04. januar 2008 - 20:26 #7
Igen har det stor betydning, hvordan resten af formularen ser ud. Prøv at skrive hele koden her eller smid et link.
Avatar billede lesp Nybegynder
04. januar 2008 - 20:50 #8
<form method='post' action='ikurv.php'>
/en masse input/
<div class='buttonwrapper'>
<a class='squarebutton' href='#' onclick='this.form.submit()'><span>Læg i kurv</span></a></form>
Avatar billede w13 Novice
04. januar 2008 - 21:12 #9
Følgende burde i hvert fald gøre det:

<form id='form1' method='post' action='ikurv.php'>
/en masse input/
<div class='buttonwrapper'>
<a class='squarebutton' href='#' onclick='document.getElementById('form1').submit()'><span>Læg i kurv</span></a>
</form>
Avatar billede lesp Nybegynder
04. januar 2008 - 21:31 #10
skal <div> tagget ikke lukkes?
Avatar billede lesp Nybegynder
04. januar 2008 - 21:32 #11
For den virker i hvert fald ikke... :(
Avatar billede w13 Novice
04. januar 2008 - 21:46 #12
Jo, det skal det også.
Avatar billede w13 Novice
04. januar 2008 - 21:47 #13
Nu ser jeg, at du bruger tegnet ' i stedet for " - derfor må der ikke stå ' inde i onclick også. Ret til:

<form id='form1' method='post' action='ikurv.php'>
/en masse input/
<div class='buttonwrapper'>
<a class='squarebutton' href='#' onclick='document.getElementById("form1").submit()'><span>Læg i kurv</span></a>
</div>
</form>
Avatar billede w13 Novice
04. januar 2008 - 21:49 #14
Følgende kode er testet og virker:

<html>
<head>
</head>
<body>
<form id="form1" method="post" action="ikurv.php">
/en masse input/
<div class="buttonwrapper">
    <a class="squarebutton" href="java script:void(0)" onclick="document.getElementById('form1').submit()">Læg i kurv</a>
</div>
</form>
</body>
</html>
Avatar billede lesp Nybegynder
05. januar 2008 - 19:36 #15
Ja, men problemet er, at jeg har formen i en php-fil og derfor er jeg nødt til at skrive '' og ikke "".
Avatar billede w13 Novice
05. januar 2008 - 20:00 #16
Du kan skrive " i en php-fil ved at skrive \"
Avatar billede lesp Nybegynder
05. januar 2008 - 20:26 #17
Så den skal se sådan ud?:

<form id='form1' method='post' action='ikurv.php'>
/en masse input/
<div class=\"buttonwrapper\">
    <a class=\"squarebutton\" href=\"java script:void(0)\" onclick=\"document.getElementById('form1').submit()\">Læg i kurv</a>
</div>
</form>
Avatar billede w13 Novice
05. januar 2008 - 20:33 #18
Det ser rigtigt ud, ja.
Avatar billede w13 Novice
05. januar 2008 - 20:35 #19
Men ellers kan man jo altså godt gøre sådan i PHP:

<?php
...
?>

<form id="form1" method="post" action="ikurv.php">
/en masse input/
<div class="buttonwrapper">
    <a class="squarebutton" href="java script:void(0)" onclick="document.getElementById('form1').submit()">Læg i kurv</a>
</div>

<?php
...
?>

Så længe du skriver HTML-koden uden for PHP-koden, kan du sagtens bruge både " og '.
Avatar billede lesp Nybegynder
05. januar 2008 - 22:23 #20
Den knap jeg har består af to billeder. Men din kode w13 forsvinder det ene billede, og knappen er dermed halv. Her er link til hvor jeg fik knappen:

http://www.dynamicdrive.com/style/csslibrary/item/css_square_buttons
Avatar billede lesp Nybegynder
05. januar 2008 - 22:26 #21
Der er kun det venstre billede nu.
Avatar billede w13 Novice
05. januar 2008 - 22:41 #22
Så brug din oprindelige kode igen og ret den til. Pointen er bare, at du sætter  onclick="document.getElementById('form1').submit()" på det object, som skal klikkes på.
Avatar billede lesp Nybegynder
05. januar 2008 - 22:53 #23
Og det gjorde, og det virkede, og du fortjener points :)
Avatar billede w13 Novice
05. januar 2008 - 23:20 #24
Og jeg takker for point! :)
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