onchange form
Een klein formuliertje waarbij de keuze uit de select lijst bepaalt hoe vaak een bepaalde regel herhaald wordt. Hoe krijg ik de waarde uit het formulier terug in de php for-loop?
Het is voor het eerst dat ik met javascript experimenteer...
Alvast bedankt!
hier is de code:
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
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
<html>
<head>
<script type="text/javascript">
function getPlayers()
{
var mylist = document.getElementById("players");
document.getElementById("showPlayers").value = players.options[players.selectedIndex].value;
}
</script>
</head>
<body>
<form>
how many players:
<select id="players" onchange="getPlayers()">
<option selected></option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
<div id="showPlayers">
<?php
for($i = 1; $i < 4; $i +=1)
{
echo '<input type="Text" name="player'.$i.'" value="player'.$i.'"> <input type="checkbox" value="0"> invite<br>';
}
?>
</div>
</form>
</body>
</html>
<head>
<script type="text/javascript">
function getPlayers()
{
var mylist = document.getElementById("players");
document.getElementById("showPlayers").value = players.options[players.selectedIndex].value;
}
</script>
</head>
<body>
<form>
how many players:
<select id="players" onchange="getPlayers()">
<option selected></option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
<div id="showPlayers">
<?php
for($i = 1; $i < 4; $i +=1)
{
echo '<input type="Text" name="player'.$i.'" value="player'.$i.'"> <input type="checkbox" value="0"> invite<br>';
}
?>
</div>
</form>
</body>
</html>
Gewijzigd op 01/01/1970 01:00:00 door Raul Wallaart
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
42
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
42
<html>
<head>
<script type="text/javascript">
function getPlayers()
{
var x = document.getElementById("players").value;
if(x == 2) {document.getElementById("block2").style.display = 'block';}
else{document.getElementById("block2").style.display = 'none';}
if(x == 3) {document.getElementById("block3").style.display = 'block';}
else{document.getElementById("block3").style.display = 'none';}
if(x == 4) {document.getElementById("block4").style.display = 'block';}
else{document.getElementById("block4").style.display = 'none';}
}
</script>
</head>
<body>
<form name="form1">
how many players:
<select id="players" onchange="getPlayers()">
<option></option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
<br>
Player 1 is you of course, you are already invited, by your self!!.<br>
<div id="block2"><br>
<input type="Text" name="speler2" value="speler 2"> <input type="checkbox"> uitnodigen
</div>
<div id="block3"><br>
<input type="Text" name="speler2" value="speler 2"> <input type="checkbox"> uitnodigen<br>
<input type="Text" name="speler3" value="speler 3"> <input type="checkbox"> uitnodigen
</div>
<div id="block4"><br>
<input type="Text" name="speler2" value="speler 2"> <input type="checkbox"> uitnodigen<br>
<input type="Text" name="speler3" value="speler 3"> <input type="checkbox"> uitnodigen<br>
<input type="Text" name="speler4" value="speler 4"> <input type="checkbox"> uitnodigen
</div>
</form>
</body>
</html>
<head>
<script type="text/javascript">
function getPlayers()
{
var x = document.getElementById("players").value;
if(x == 2) {document.getElementById("block2").style.display = 'block';}
else{document.getElementById("block2").style.display = 'none';}
if(x == 3) {document.getElementById("block3").style.display = 'block';}
else{document.getElementById("block3").style.display = 'none';}
if(x == 4) {document.getElementById("block4").style.display = 'block';}
else{document.getElementById("block4").style.display = 'none';}
}
</script>
</head>
<body>
<form name="form1">
how many players:
<select id="players" onchange="getPlayers()">
<option></option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
<br>
Player 1 is you of course, you are already invited, by your self!!.<br>
<div id="block2"><br>
<input type="Text" name="speler2" value="speler 2"> <input type="checkbox"> uitnodigen
</div>
<div id="block3"><br>
<input type="Text" name="speler2" value="speler 2"> <input type="checkbox"> uitnodigen<br>
<input type="Text" name="speler3" value="speler 3"> <input type="checkbox"> uitnodigen
</div>
<div id="block4"><br>
<input type="Text" name="speler2" value="speler 2"> <input type="checkbox"> uitnodigen<br>
<input type="Text" name="speler3" value="speler 3"> <input type="checkbox"> uitnodigen<br>
<input type="Text" name="speler4" value="speler 4"> <input type="checkbox"> uitnodigen
</div>
</form>
</body>
</html>
Gewijzigd op 01/01/1970 01:00:00 door Raul Wallaart
Pas je script even aan en gebruik en tags om je code heen. Gebruik je
knop om dit te doen.Niet Bumpen.
Bumpen::
Twee of meer keer achter elkaar in een topic posten heet bumpen. Bumpen is pas na 24 uur toegestaan en kan een reden zijn voor de admins en moderators om een topic te sluiten. Gebruik indien nodig de knop om je tekst aan te passen.
knop om je tekst aan te passen.SanThe.
Gewijzigd op 01/01/1970 01:00:00 door - SanThe -
@Santhe : Nu kan je best ook in je profiel Leiden zetten :)
Grtz
en nog veel suc6 hier. ;-)
@SanThe: helaas geen stadsgenoot meer, ik zie dat ik mijn gegevens weer eens moet updaten.
Ik was me niet bewust van het 'bumpen', excuses daarvoor, maar begrijp ik goed dat ik pas weer mag posten nadat iemand anders iets heeft gepost op mijn bericht of anders pas na 24 uur, ondanks dat ik wellicht een geniale ingeving heb voor mijn (geposte) probleem en dus iemand anders ernaar laat kijken, terwijl ik ondertussen mijn antwoord al heb?
Groet
Gewijzigd op 01/01/1970 01:00:00 door Raul Wallaart
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
<html>
<head>
<script type="text/javascript" src="mootools/mootools.js"></script>
<script type="text/javascript">
window.addEvent ('domready', function () {
$('players').addEvent ('change', function () {
var n = this.getValue ();
$('showPlayers').empty ();
for (i = 1; i <= n; i++) {
var p = document.createElement ('p');
p.innerHTML = 'player ' + i;
$('showPlayers').appendChild(p);
var inp = document.createElement ('input');
inp.id = 'player' + i;
inp.name = 'player[]';
inp.type = 'checkbox';
inp.value = inp.id;
p.appendChild (inp);
var l = document.createElement ('label');
l.setAttribute ('for', inp.id);
l.innerHTML = 'invite';
p.appendChild (l);
}
});
});
</script>
</head>
<body>
<form>
how many players:
<select id="players" name="players">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
<div id="showPlayers">
</div>
</form>
</body>
</html>
<head>
<script type="text/javascript" src="mootools/mootools.js"></script>
<script type="text/javascript">
window.addEvent ('domready', function () {
$('players').addEvent ('change', function () {
var n = this.getValue ();
$('showPlayers').empty ();
for (i = 1; i <= n; i++) {
var p = document.createElement ('p');
p.innerHTML = 'player ' + i;
$('showPlayers').appendChild(p);
var inp = document.createElement ('input');
inp.id = 'player' + i;
inp.name = 'player[]';
inp.type = 'checkbox';
inp.value = inp.id;
p.appendChild (inp);
var l = document.createElement ('label');
l.setAttribute ('for', inp.id);
l.innerHTML = 'invite';
p.appendChild (l);
}
});
});
</script>
</head>
<body>
<form>
how many players:
<select id="players" name="players">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
<div id="showPlayers">
</div>
</form>
</body>
</html>
In ieder geval bedankt voor je tijd en moeite
Raúl
in mijn voorbeeld maak ik gebruik van het Mootools Framework. Om dat goed te laten werken heb je mootools.js nodig.
Op regel 3 van mijn voorbeeld hierboven zie je dat mootools.js geinclude wordt. Bij mij staat het in een map met de naam mootools.
Veel succes met het bestuderen van het voorbeeld ;-)
Ik was zelf al op zoek gegaan en vond een tutorial van Harmen over mootools hier op phphulp.
Raul schreef op 02.05.2008 12:14:
Typisch een gevalletje van de klepel gehoord, maar de klok niet zien hangen....
Het is trouwens ''Hij heeft de klok horen luiden, maar weet niet waar de klepel hangt.. ;)
Thanx! Ik was benieuwd of iemand er op zou reageren.... ;)
ik wel weer natuurlijk ;)