PHPhulp.nl
35k+ leden Over PHPhulp Offerte opdracht Contact
M

Invoerveld met alleen nummers toegestaan

Door Martin Roelofs op 13-09-2022 20:47
1.242 views
Beste forumleden,

Op onze website staat een inschrijfformulier. Bij twee invoervelden is het de bedoeling dat daar alleen nummers worden ingevuld en geen letters. Welke code moet ik dan schrijven? Nu kan er zowel tekst als nummers ingevoerd worden.
Zo staat het er nu:

<div class="form-group">
<label>IVAO ID</label>
<input name="ivao_id" type="text" id="ivao_id" maxlength="6"
class="form-control"
value="<?php echo htmlspecialchars($ivao_id)?>" />
- Ariën -
13-09-2022 21:40
En in PHP controleren met [php]is_numeric[/php].
Let wel even op wat er wordt geaccepteerd.
M Martin Roelofs
13-09-2022 22:35
Hartelijk dank! Gelukt!

[size=xsmall]Toevoeging op 14/09/2022 07:05:06:[/size]

Na het testen nog een klein probleempje.
Ik heb voor het invoerveld een max lengte opgegeven van 6 cijfers, maar ik kan er toch gewoon 20 invoeren.
Hoe kan dat?

<input name="ivao_id" type="number" id="ivao_id" maxlength="6"
Ivo P
14-09-2022 09:13 gewijzigd op 14-09-2022 09:14
Werkt het wel als je in plaats daarvan de max-waarde opgeeft (6 negens)
<input name="ivao_id" type="number" id="ivao_id" max="999999">


[size=xsmall]Toevoeging op 14/09/2022 09:14:03:[/size]

en eventueel min="0" om te voorkomen dat iemand -9999999999999999 opgeeft.

(ah, adoptive was me inmiddels al voor)
M Martin Roelofs
14-09-2022 11:33
Het lukt nu wel maxlenght="6"
Maar dan kan ik dus zowel 6 letters als 6 cijfers plaatsen en meer niet.
Als ik dan type=text verander in type=number, dan kan ik geen letters meer plaatsen en alleen nummers.
Dat is op zich dus goed, maar ik kan dan wel weer 25 nummers invoeren.
Hoe zorg ik er nu voor dat ik maar 6 cijfers in kan voeren?
- Ariën -
14-09-2022 11:52
maxlength="6

Let op je spelfout daarin.

[size=xsmall]Toevoeging op 14/09/2022 11:58:54:[/size]

En vergeet ook niet serverside te controleren. HTML is door een bezoeker eenvoudig te manipuleren.
M Martin Roelofs
14-09-2022 12:46
Het lukt nog steeds niet.
Ik kan nog steeds meer dan 20 nummers invullen.
Ook niet zoals Ariën zegt over de spelfout maxlength="6

Nu staat het zo: maar kan nog steeds meer dan 20 nummers invullen.

<div class="form-group">
<label>IVAO ID</label>
<input name="ivao_id" type="number" id="ivao_id" maxlength="6"
class="form-control"

Zo ook niet:

<div class="form-group">
<label>IVAO ID</label>
<input name="ivao_id" type="number" id="ivao_id" max="999999" min="0"
class="form-control"


Zo ook niet:
<div class="form-group">
<label>IVAO ID</label>
<input name="ivao_id" type="number" id="ivao_id" min="0" max="6"
class="form-control"
Ivo P
14-09-2022 14:12 gewijzigd op 14-09-2022 15:27
je hebt vrij consequent geen afsluitenden > bij je <input tag?

[size=xsmall]Toevoeging op 14/09/2022 14:18:33:[/size]

https://jsfiddle.net/pehaict/4qcksyw2/

Daar kun je zien hoe de html5 beveiliging hier werkt: je krijgt een melding dat form niet gesubmit kan worden met deze foute waarde erin.

Wil je het on the fly bijwerken, dan kun je met javascript dat oplossen (onkeyup en/of onchange)

[size=xsmall]Toevoeging op 14/09/2022 14:25:22:[/size]
https://jsfiddle.net/pehaict/byjqwuc0/4/
jsfiddle aangepast: nu met jQuery oplossing voor de 2e input.
Zodra er meer dan 3 tekens staan, zal hij het afkappen

Reageren

Inloggen om te reageren