Virusscanner tips?
[OPGELOST] volgorde van submit buttons
Ik heb op een formulier 2 buttons geplaatst. Eén om terug te gaan naar het vorige en één moet de echte <enter> zijn.
Als ik beiden met <input type='submit'> maak dan reageert de eerste als ik enter geef met het toetsenbord en gaan we terug naar de vorige pagina. Ik wil juist dat het op de 2de reageert.
Nu heb ik het volgende bedacht:
Code (php)
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
<html>
<div class="submit links">
<a href="beheer_megalieten.php" >
<input class="submit" type="button" name='vorig' value="<<<VORIG" />
</a>
</div>
<div class="submit rechts">
<input class="submit volgende" type="submit" name="volgende" value="VOLGENDE>>>" />
</div>
</html>
<div class="submit links">
<a href="beheer_megalieten.php" >
<input class="submit" type="button" name='vorig' value="<<<VORIG" />
</a>
</div>
<div class="submit rechts">
<input class="submit volgende" type="submit" name="volgende" value="VOLGENDE>>>" />
</div>
</html>
Dat werkt zoals ik wil, maar ja, dit komt weer niet door de validator. Ik mag <input> niet in een <a> zetten.
Wie weet hoe het wel moet?
Jop
Of de <a> stylen zodat die lijkt op een button?
Maar die "back" optie is toch eigenlijk geen submit?
CSS
Code (php)
1
button[name^="btnBack"]{float:left;}
CODE (uit mijn eerdere voorbeeld)
Code (php)
1
2
3
4
2
3
4
<form method="POST">
<button name="btnNext[2]">Next</button>
<button name="btnBack[0]">Back</button>
</form>
<button name="btnNext[2]">Next</button>
<button name="btnBack[0]">Back</button>
</form>
tabindex is om met tab door het formulier te gaan en dan de volgorde aan te geven. dat geeft volgens mij niet de oplossing van het probleem. als ik bij het eerste invulveld <enter> wil ik dat de tweede knop wordt gekozen.
zelf een knop maken die erg lijkt op de standaard kan, maar ziet er nooit hetzelfde uit. Is bovendien veel werk.
ik weet niet wat je bedoelt met dat de "back" geen submit is.
Ik neem aan dat er gewoon een standaard oplossing voor is? ik zie vaker meerdere knoppen op een formulier.
Toevoeging op 30/04/2014 13:28:53:
@Michael
werkt dat ook met <input> tags ipv <button>?
enig idee wat de css moet zijn om de "back" links uit te lijnen en de "forward" rechts. Had al heel veel geknoeid met de css om ze zo goed te krijgen:
Code (php)
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
#form_mega .submit{
width: 200px;
margin-top: 10px;
display: inline-block;
}
#form_mega .links{
}
#form_mega .rechts{
float: right;
}
width: 200px;
margin-top: 10px;
display: inline-block;
}
#form_mega .links{
}
#form_mega .rechts{
float: right;
}
Toevoeging op 30/04/2014 13:48:30:
Omdraaien van de buttons was een simpele en doeltreffende oplossing. Hoefde zelfs de CSS niet aan te passen. Dank Michael.
Ja.
> enig idee wat de css moet zijn om de "back" links uit te lijnen en de "forward" rechts
Ligt eraan wat precies de locatie van de buttons moet worden.
In mijn voorbeeld staan beide buttons gewoon links van het formulier
[next][back]
Door back dan float:left; te geven wordt deze links uitgelijnd.
[back][next]
Let er wel op dat je na een float vaak een 'clearfix' nodig hebt. Een div met style clear:both; omdat anders alles waar daarna komt er tegenaan wordt geplakt i.p.v. eronder.
> Omdraaien van de buttons was een simpele en doeltreffende oplossing. Hoefde zelfs de CSS niet aan te passen. Dank Michael.
Graag gedaan.