Gebruik van required in input-veld
Ik gebruik de instelling required bij mijn inputvelden. Werkt allemaal naar behoren.
Nu wil ik eigenlijk een verdere toepassing gebruiken, nl als er één van de velden niet juist is ingevuld dat ik dit kan opslaan in een variabele om later in een andere situatie te kunnen gebruiken. (Ik gebruik nl. een tabblad dat in onderhavig geval niet mag worden geopend als niet alle velden juist zijn ingevuld.
Code's
De CSS
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
input[type=text]:invalid,input[type=phone]:invalid,input[type=tel]:invalid,input[type=file]:invalid,input[type=date]:invalid,input[type=email]:invalid,input[type=url]:invalid,input[type=password]:invalid {
background: #efdee0 url(../images/invalid.png) no-repeat center right;
}
input[type=text]:valid,input[type=phone]:valid,input[type=tel]:valid,input[type=file]:valid,input[type=date]:valid,input[type=email]:valid,input[type=url]:valid,input[type=password]:valid {
background: #f3f8ed url(../images/valid.png) no-repeat center right;
}
background: #efdee0 url(../images/invalid.png) no-repeat center right;
}
input[type=text]:valid,input[type=phone]:valid,input[type=tel]:valid,input[type=file]:valid,input[type=date]:valid,input[type=email]:valid,input[type=url]:valid,input[type=password]:valid {
background: #f3f8ed url(../images/valid.png) no-repeat center right;
}
De HTML5
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<div id="tabs-2">
<?php
if($nAantalInWinkelwagen == 0 ) {
?>
<h5>U heeft nog geen artikelen in uw winkelwagen geplaatst</h5>
<?php } else { ?>
<h5>Uw gegevens</h5>
<section class="regelhoogte300">
<div class="regelhoogte25"></div>
<form action="shop_winkelwagen.php" method="POST">
<div class="tagline_links">
<label>Voorletter(s):</label><br />
<input type="text" name="voorletters" required="" autofocus="" placeholder="Uw voorletters" /><br />
</div>
<div class="tagline_links">
<label>Evt. tussenvoeging:</label><br />
<input type="text" name="tussenvoeg" placeholder="Eventuele tussenvoeging" /><br />
</div>
<div class="tagline_links">
<label>Naam:</label><br />
<input type="text" name="naam" required="" placeholder="Uw familienaam" /><br />
</div>
<div class="tagline_links">
<div class="regelhoogte25"></div>
<p class="midden rodetekst"><a href="#" target="_self">Gegevens opslaan</a></p>
</div>
<div class="regelhoogte25"></div>
<div class="regelhoogte25"></div>
</form>
<?php } ?>
</section>
</div>
<div id="tabs-3">
<?php
if($nAantalInWinkelwagen == 0 ) {
?>
<h5>U heeft nog geen artikelen in uw winkelwagen geplaatst</h5>
<?php } else { ?>
<h5>Controle</h5>
<?php } ?>
</div>
<?php
if($nAantalInWinkelwagen == 0 ) {
?>
<h5>U heeft nog geen artikelen in uw winkelwagen geplaatst</h5>
<?php } else { ?>
<h5>Uw gegevens</h5>
<section class="regelhoogte300">
<div class="regelhoogte25"></div>
<form action="shop_winkelwagen.php" method="POST">
<div class="tagline_links">
<label>Voorletter(s):</label><br />
<input type="text" name="voorletters" required="" autofocus="" placeholder="Uw voorletters" /><br />
</div>
<div class="tagline_links">
<label>Evt. tussenvoeging:</label><br />
<input type="text" name="tussenvoeg" placeholder="Eventuele tussenvoeging" /><br />
</div>
<div class="tagline_links">
<label>Naam:</label><br />
<input type="text" name="naam" required="" placeholder="Uw familienaam" /><br />
</div>
<div class="tagline_links">
<div class="regelhoogte25"></div>
<p class="midden rodetekst"><a href="#" target="_self">Gegevens opslaan</a></p>
</div>
<div class="regelhoogte25"></div>
<div class="regelhoogte25"></div>
</form>
<?php } ?>
</section>
</div>
<div id="tabs-3">
<?php
if($nAantalInWinkelwagen == 0 ) {
?>
<h5>U heeft nog geen artikelen in uw winkelwagen geplaatst</h5>
<?php } else { ?>
<h5>Controle</h5>
<?php } ?>
</div>
Ik wil nu als de verplichte velden niet juist zijn ingevuld dat het tabje met id "tabs-3" een melding geeft als bijv. "Nog niet alle velden zijn juist ingevuld".
Wie heeft een idee??
George
Er zijn nog geen reacties op dit bericht.