html formulier naar php
De fout error codes (als er een veld niet ingevuld is) zou ik graag in het formulier zelf laten zien. De bedankt pagina niet.
hoe kan ik dit het beste aanpakken? Iemand van jullie inhuren
die het form aanpast, laat testen, betaald? budget max 50,- euro
mijn html form:
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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 STRICT//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="CACHE-CONTROL" content="NO-CACHE">
<meta http-equiv="PRAGMA" content="NO-CACHE">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script src="http://maps.google.nl/maps?file=api&v=2&key=ABQIAAAAFfkqaO0Jn3KjadwVU2kClRR3FMzSG_BhkConUQc01cIDUZjBThRoAyCOE_jsR4DkNSVgbSG1JOQiHg" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var map = null;
var geocoder = null;
function load() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
geocoder = new GClientGeocoder();
}
}
function showAddress(address) {
if (geocoder) {
geocoder.getLatLng(
address,
function(point) {
if (!point) {
alert(address + "geen geldig adres gevonden.");
} else {
var map = new GMap2(document.getElementById("map_canvas"));
marker = new GMarker(point, {draggable: true});
map.setCenter(marker.getPoint(), 17);
map.setMapType( G_SATELLITE_MAP );
document.getElementById('lat').value = marker.getPoint().lat().toFixed(6);
document.getElementById('lon').value = marker.getPoint().lng().toFixed(6);
GEvent.addListener(marker, "click", function() {
var point = marker.getPoint();
var lat = document.getElementById('lat').value;
var lon = document.getElementById('lon').value;
var naam = document.getElementById('naam').value;
var adres = document.getElementById('adres').value;
var postcode = document.getElementById('postcode').value;
var plaats = document.getElementById('plaats').value;
var url = document.getElementById('url').value;
var telefoon = document.getElementById('telefoon').value;
var land = document.getElementById('land').value;
var html = ("<b>" + naam + "</b><br>" + adres + "<br>" + postcode + "<br>" + plaats + "<br>" + land + "<br><br>" + url + "<br>" + telefoon + "<br>Lat: " + lat + "<br>Lon: " + lon);
marker.openInfoWindowHtml(html);
});
GEvent.addListener(marker, "dragstart", function() {
map.closeInfoWindow();
});
GEvent.addListener(marker, "dragend", function() {
var point = marker.getPoint();
document.getElementById('lat').value = marker.getPoint().lat().toFixed(6);
document.getElementById('lon').value = marker.getPoint().lng().toFixed(6);
});
map.addOverlay(marker);
}
}
);
}
}
//]]>
</script>
<style type="text/css">
<!--
.style1 {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FF0000
}
.style2 {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.style3 {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
}
-->
</style>
</head>
<body onload="load()" onunload="GUnload()">
<form name="form" action="#" onsubmit="showAddress(this.locatie.value); return false">
<table width="800" border="0" align="center">
<tr>
<td colspan="3"><span class="style3">Correctie / nieuwe locatie formulier modelbouwlocaties:</span></td>
</tr>
<tr>
<td colspan="3"><span class="style1">ERROR: Het invulveld xxxx is leeg of niet correct ingevuld</span></td>
</tr>
<tr>
<td width="127" valign="top"><span class="style2">Soort locatie (<span class="style1">*</span>)</span></td>
<td width="200"><span class="style2">
<label>
<input type="radio" name="locatie" id="modelbouwwinkel" value="gray" />
modelbouwwinkel<br />
<input type="radio" name="locatie" id="modelvliegclub" value="red" />
modelvliegclub<br />
<input type="radio" name="locatie" id="modelbotenclub" value="blue" />
modelbotenclub<br />
<input type="radio" name="locatie" id="modelautoclub" value="green" />
modelautoclub<br />
</label>
</span></td>
<td width="459" rowspan="21" valign="top"><div class="style2" id="map_canvas" style="width: 460px; height: 500px"></div>
<span class="style2">Nadat de "marker" op de kaart staat kunt u deze naar de exacte locatie slepen.</span></td>
</tr>
<tr>
<td><span class="style2">Naam locatie (<span class="style1">*</span>)</span></td>
<td><input name="naam" type="text" id="naam" value="" size="30" /></td>
</tr>
<tr>
<td><span class="style2">Adres (<span class="style1">*</span>)</span></td>
<td><input name="adres" type="text" id="adres" value="" size="30" /></td>
</tr>
<tr>
<td><span class="style2">Postcode</span></td>
<td><input name="postcode" type="text" id="postcode" value="" size="10" /></td>
</tr>
<tr>
<td><span class="style2">Plaats (<span class="style1">*</span>)</span></td>
<td><input name="plaats" type="text" id="plaats" value="" size="30" /></td>
</tr>
<tr>
<td><span class="style2">Website (<span class="style1">*</span>)</span></td>
<td><input name="url" type="text" id="url" value="" size="30" /></td>
</tr>
<tr>
<td><span class="style2">Telefoon</span></td>
<td><input name="telefoon" type="text" id="telefoon" value="" size="10" /></td>
</tr>
<tr>
<td colspan="2"><span class="style2">
<input name="land" type="hidden" id="land" value="Nederland" />
------------------- Google informatie -------------------</span></td>
</tr>
<tr>
<td><span class="style2">Lat</span></td>
<td><input name="lat" type="text" id="lat" value="" size="10" readonly="readonly"/></td>
</tr>
<tr>
<td><span class="style2">Lon</span></td>
<td><input name="lon" type="text" id="lon" value="" size="10" readonly="readonly"/></td>
</tr>
<tr>
<td colspan="2"><span class="style2">
<input name="locatie" type="hidden" value="" size="60" />
------------------ Afzender informatie ------------------</span></td>
</tr>
<tr>
<td><span class="style2">
<label>Uw naam</label>
</span></td>
<td valign="top"><span class="style2">
<input name="afznaam" type="text" id="afznaam" size="30" />
</span></td>
</tr>
<tr>
<td><span class="style2"></span><span class="style2">Uw e-mailadres</span></td>
<td valign="top"><span class="style2">
<input name="afzemail" type="text" id="afzemail" size="30" />
</span></td>
</tr>
<tr>
<td valign="top"><span class="style2">Opmerking</span></td>
<td><span class="style2">
<textarea name="bericht" cols="25" rows="4" id="bericht"></textarea>
</span></td>
</tr>
<tr>
<td class="style2"><label>Validatie</label></td>
<td valign="middle" class="style2"><img src="" width="64" height="32" alt="" /> Captcha validatie</td>
</tr>
<tr>
<td><span class="style2">Validatiecode</span></td>
<td><span class="style2">
<input type="text" name="validatie" id="validatie" />
</span></td>
</tr>
<tr>
<td colspan="2"><div align="center" class="style2">
<input type="submit" value="Toon op kaart" onclick="form.locatie.value=this.form.adres.value +', ' + this.form.plaats.value;"/>
<input type="submit" name="verstuur" id="verstuur" value="verstuur" />
</div></td>
</tr>
</table>
</form>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="CACHE-CONTROL" content="NO-CACHE">
<meta http-equiv="PRAGMA" content="NO-CACHE">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script src="http://maps.google.nl/maps?file=api&v=2&key=ABQIAAAAFfkqaO0Jn3KjadwVU2kClRR3FMzSG_BhkConUQc01cIDUZjBThRoAyCOE_jsR4DkNSVgbSG1JOQiHg" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var map = null;
var geocoder = null;
function load() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
geocoder = new GClientGeocoder();
}
}
function showAddress(address) {
if (geocoder) {
geocoder.getLatLng(
address,
function(point) {
if (!point) {
alert(address + "geen geldig adres gevonden.");
} else {
var map = new GMap2(document.getElementById("map_canvas"));
marker = new GMarker(point, {draggable: true});
map.setCenter(marker.getPoint(), 17);
map.setMapType( G_SATELLITE_MAP );
document.getElementById('lat').value = marker.getPoint().lat().toFixed(6);
document.getElementById('lon').value = marker.getPoint().lng().toFixed(6);
GEvent.addListener(marker, "click", function() {
var point = marker.getPoint();
var lat = document.getElementById('lat').value;
var lon = document.getElementById('lon').value;
var naam = document.getElementById('naam').value;
var adres = document.getElementById('adres').value;
var postcode = document.getElementById('postcode').value;
var plaats = document.getElementById('plaats').value;
var url = document.getElementById('url').value;
var telefoon = document.getElementById('telefoon').value;
var land = document.getElementById('land').value;
var html = ("<b>" + naam + "</b><br>" + adres + "<br>" + postcode + "<br>" + plaats + "<br>" + land + "<br><br>" + url + "<br>" + telefoon + "<br>Lat: " + lat + "<br>Lon: " + lon);
marker.openInfoWindowHtml(html);
});
GEvent.addListener(marker, "dragstart", function() {
map.closeInfoWindow();
});
GEvent.addListener(marker, "dragend", function() {
var point = marker.getPoint();
document.getElementById('lat').value = marker.getPoint().lat().toFixed(6);
document.getElementById('lon').value = marker.getPoint().lng().toFixed(6);
});
map.addOverlay(marker);
}
}
);
}
}
//]]>
</script>
<style type="text/css">
<!--
.style1 {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FF0000
}
.style2 {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.style3 {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
}
-->
</style>
</head>
<body onload="load()" onunload="GUnload()">
<form name="form" action="#" onsubmit="showAddress(this.locatie.value); return false">
<table width="800" border="0" align="center">
<tr>
<td colspan="3"><span class="style3">Correctie / nieuwe locatie formulier modelbouwlocaties:</span></td>
</tr>
<tr>
<td colspan="3"><span class="style1">ERROR: Het invulveld xxxx is leeg of niet correct ingevuld</span></td>
</tr>
<tr>
<td width="127" valign="top"><span class="style2">Soort locatie (<span class="style1">*</span>)</span></td>
<td width="200"><span class="style2">
<label>
<input type="radio" name="locatie" id="modelbouwwinkel" value="gray" />
modelbouwwinkel<br />
<input type="radio" name="locatie" id="modelvliegclub" value="red" />
modelvliegclub<br />
<input type="radio" name="locatie" id="modelbotenclub" value="blue" />
modelbotenclub<br />
<input type="radio" name="locatie" id="modelautoclub" value="green" />
modelautoclub<br />
</label>
</span></td>
<td width="459" rowspan="21" valign="top"><div class="style2" id="map_canvas" style="width: 460px; height: 500px"></div>
<span class="style2">Nadat de "marker" op de kaart staat kunt u deze naar de exacte locatie slepen.</span></td>
</tr>
<tr>
<td><span class="style2">Naam locatie (<span class="style1">*</span>)</span></td>
<td><input name="naam" type="text" id="naam" value="" size="30" /></td>
</tr>
<tr>
<td><span class="style2">Adres (<span class="style1">*</span>)</span></td>
<td><input name="adres" type="text" id="adres" value="" size="30" /></td>
</tr>
<tr>
<td><span class="style2">Postcode</span></td>
<td><input name="postcode" type="text" id="postcode" value="" size="10" /></td>
</tr>
<tr>
<td><span class="style2">Plaats (<span class="style1">*</span>)</span></td>
<td><input name="plaats" type="text" id="plaats" value="" size="30" /></td>
</tr>
<tr>
<td><span class="style2">Website (<span class="style1">*</span>)</span></td>
<td><input name="url" type="text" id="url" value="" size="30" /></td>
</tr>
<tr>
<td><span class="style2">Telefoon</span></td>
<td><input name="telefoon" type="text" id="telefoon" value="" size="10" /></td>
</tr>
<tr>
<td colspan="2"><span class="style2">
<input name="land" type="hidden" id="land" value="Nederland" />
------------------- Google informatie -------------------</span></td>
</tr>
<tr>
<td><span class="style2">Lat</span></td>
<td><input name="lat" type="text" id="lat" value="" size="10" readonly="readonly"/></td>
</tr>
<tr>
<td><span class="style2">Lon</span></td>
<td><input name="lon" type="text" id="lon" value="" size="10" readonly="readonly"/></td>
</tr>
<tr>
<td colspan="2"><span class="style2">
<input name="locatie" type="hidden" value="" size="60" />
------------------ Afzender informatie ------------------</span></td>
</tr>
<tr>
<td><span class="style2">
<label>Uw naam</label>
</span></td>
<td valign="top"><span class="style2">
<input name="afznaam" type="text" id="afznaam" size="30" />
</span></td>
</tr>
<tr>
<td><span class="style2"></span><span class="style2">Uw e-mailadres</span></td>
<td valign="top"><span class="style2">
<input name="afzemail" type="text" id="afzemail" size="30" />
</span></td>
</tr>
<tr>
<td valign="top"><span class="style2">Opmerking</span></td>
<td><span class="style2">
<textarea name="bericht" cols="25" rows="4" id="bericht"></textarea>
</span></td>
</tr>
<tr>
<td class="style2"><label>Validatie</label></td>
<td valign="middle" class="style2"><img src="" width="64" height="32" alt="" /> Captcha validatie</td>
</tr>
<tr>
<td><span class="style2">Validatiecode</span></td>
<td><span class="style2">
<input type="text" name="validatie" id="validatie" />
</span></td>
</tr>
<tr>
<td colspan="2"><div align="center" class="style2">
<input type="submit" value="Toon op kaart" onclick="form.locatie.value=this.form.adres.value +', ' + this.form.plaats.value;"/>
<input type="submit" name="verstuur" id="verstuur" value="verstuur" />
</div></td>
</tr>
</table>
</form>
</body>
</html>
Gewijzigd op 01/01/1970 01:00:00 door Milcoi
Het formulier op zich werkt wel.
Er kan nog een stuk javascript bij, zodat wordt gecontroleerd of de velden goed zijn ingevuld.
"Toon op kaart" lijkt ook te werken. Je zou wel nog een zoom moeten kunnen toevoegen, want sommige locaties hebben geen luchtfoto die zo gedetailleerd is.
Verder: wat moet er precies gebeuren wanneer het formulier wordt opgestuurd? Moet die informatie in een databank terecht komen of zo?
Het formulier werkt idd maar verstuurd en controleerd nog niet.
Dit zou dus omgezet moeten worden naar php.
Er is geen DB nodig.
De e-mail zou er zo uit komen te zien:
Locatie: xxxx
Naam locatie: xxxx
Adres: xxxx
Postcode: xxxx
Plaats: xxxx
Website: xxxx
Telefoon: xxxx
Lat: xxxx
Lon: xxxx
Naam: xxxx
E-mail: xxxx
Bericht: xxxx
ps. copieer de code nogmaals, heb het klein beetje aangepast.
Het idee is dus het formulier te checken of alles klopt en een e-mail te versturen met de informatie?
Je kan dit het best checken in AJAX, ik kan dit voor je installeren voor of velden leeg zijn.
En anders de bestelpagina tonen.
Groetjes
Dominic
E-mail: [email protected]
MSN: [email protected]
Gewijzigd op 01/01/1970 01:00:00 door Dominic
Wat ik dus voor je zou willen doen (voor die 50 euro, minder kan wel, zoveel werk is het niet, mgoed), is dit complete formulier een PHP validatie geven, een mail laten sturen, en die error meldingen IN het formulier is geen probleem;)
PHP zou voldoende moeten zijn toch?
invulvelden controleren of ze leeg of gevuld zijn.
wanneer leeg en verplicht error tonen.
e-mail validatie op @ en .
captcha code invullen voor versturen e-mail
dat is wat ik zoek
kan je het voorbeeld ergens plaatsen als je daarmee klaar bent om te testen?