Check alle échte Black Friday-deals Ook zo moe van nepaanbiedingen? Wij laten alleen échte deals zien
Toon posts:

Formvalues via AJAX sturen naar script en laten zien

Pagina: 1
Acties:
  • 323 views

maandag 4 augustus 2014 12:22

Acties:
  • The Great HooD
  • Registratie: September 2009
  • Laatst online: 13-09-2014

The Great HooD

Topicstarter
Hoi,

Ik ben bezig met een klein projectje waarbij ik uiteindelijk een soort bestelling moet mailen naar de desbetreffende persoon die dan weet dat hij een bestelling krijgt..

De gehele applicatie zelf is vrijwel af, alleen de mailintegratie moet nog komen, en hier loop ik vast.

Ik heb voor het gemak de verschillende waardes die verzonden moeten worden even eraf geknipt zodat ik het eerst kan laten werken met 2-3 van die waardes.

Om het gehele probleem maar op te splitten dacht ik om eerst maar te zorgen dat het gehele outputsysteem werkt. Wat ik hier mee wil zeggen is dat ik de verschillende waardes ophaal met jQuery en verstuur naar de server door middel van AJAX en JSON. Vervolgens laat ik de server met een PHP script de waardes invullen en kan ik zien of het e.e.a. goed gaat. Hier loop ik dus vast. Er wordt helemaal niets verzonden en ook niet laten zien. Zie hier mijn bestanden:

JavaScript:
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

jQuery(document).ready(function() {

    console.log("Jquery READY!");
   jQuery("#drukbestellingdoor").click(function() { 
        //get input field values
         console.log("Druk op de knop");

        
        var naam            = jQuery('input[name=naam').val();
        var organisatie     = jQuery('input[name=organisatie').val();
        var postadres1      = jQuery('input[name=postadres1').val();
        var postadres2      = jQuery('input[name=postadres2').val();
        var afleveradres1   = jQuery('input[name=afleveradres1').val();
        var afleveradres2   = jQuery('input[name=afleveradres2').val();
        var kielnodig       = jQuery('input[name=kielnodig').val();
        var telnr           = jQuery('input[name=telnr').val();
        var email           = jQuery('input[name=email').val();
        var bericht         = jQuery('input[name=bericht').val();
                        
        
        var maat1           = jQuery('input[name=maat1]').val();
        var maat2           = jQuery('input[name=maat2]').val();
        var maat3           = jQuery('input[name=maat3]').val();
        var maat4           = jQuery('input[name=maat4]').val();
        var maat5           = jQuery('input[name=maat5]').val();
        var maat6           = jQuery('input[name=maat6]').val();
        var maat7           = jQuery('input[name=maat7]').val();
        var maat8           = jQuery('input[name=maat8]').val();
        var maat9           = jQuery('input[name=maat9]').val();
        var maat10          = jQuery('input[name=maat10]').val();
        var maat11          = jQuery('input[name=maat11]').val();
        var maat12          = jQuery('input[name=maat12]').val();
        var maat13          = jQuery('input[name=maat13]').val();


        
        //everything looks good! proceed...
        if(proceed) 
        {
            //data to be sent to server
            post_data = {'naam':naam, 'email':email, 'bericht':bericht};
            
            //Ajax post data to server
            jQuery.post('zendemail.php', post_data, function(response){  
                
                 console.log("Email verstuurd succes");
                //load json data from server and output message     
                if(response.type == 'error')
                {
                    console.log('Errorrrr' + error.text);
                    
                }else{
                
                    output = '<div class="success">'+response.text+'</div>';
                    console.log("Data met succes verzonden verstuurd succes");
                    //reset values in all input fields
                  
                }
                
                jQuery("#result").hide().html(output).slideDown();
            }, 'json');
            
        }});
    
});


code:
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
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300

<?php
$curl_connection = curl_init('zendemail.php');

?>

<html>
<script src="/kiezer/jquery.js" type="text/javascript">></script>
<script src="/kiezer/jquery.fancybox-1.3.4.js"></script>


<script src="javascript.js" type="text/javascript"></script>

<link rel="stylesheet" href="/kiezer/style.css" type="text/css" ></link>
<link rel="stylesheet" type="text/css" href="/kiezer/jquery.fancybox-1.3.4.css">
</html>

<body>
<div class="aantalenmaat">
<p>Gewenste aantallen en maten:</p>
<div class="linkerkant">
<p>Maat 1 <select class="inputboxattrib" id="Maat_1_veld" name="maat1">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p>
<p>Maat 2 <select class="inputboxattrib" id="Maat_2_veld" name="maat2">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p></p>
<p>Maat 3 <select class="inputboxattrib" id="Maat_3_veld" name="maat3">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p></p>
<p>Maat 4 <select class="inputboxattrib" id="Maat_4_veld" name="maat4">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p></p>
<p>Maat 5 <select class="inputboxattrib" id="Maat_5_veld" name="maat5">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p></p>
<p>Maat 6 <select class="inputboxattrib" id="Maat_6_veld" name="maat6">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p></p>
<p>Maat 7 <select class="inputboxattrib" id="Maat_7_veld" name="maat7">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p></p>
</div>
<div class="rechterkant">
<p>Maat 8 <select class="inputboxattrib" id="Maat_8_veld" name="maat8">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p></p>
<p>Maat 9 <select class="inputboxattrib" id="Maat_9_veld" name="maat9">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p></p>
<p>Maat 10 <select class="inputboxattrib" id="Maat_10_veld" name="maat10">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p>
<p>Maat 11 <select class="inputboxattrib" id="Maat_11_veld" name="maat11">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p></p>
<p>Maat 12 <select class="inputboxattrib" id="Maat_12_veld" name="maat12">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p></p>
<p>Maat 13 <select class="inputboxattrib" id="Maat_13_veld" name="maat13">
                <option value="0">0</option>       
                <option value="1">1.</option> 
                <option value="2">2.</option> 
                <option value="3">3.</option>
                <option value="4">4.</option>
                <option value="5">5.</option>
                <option value="6">6.</option> 
                <option value="7">7.</option> 
                <option value="8">8.</option> 
                <option value="9">9.</option>
                <option value="10">10.</option>
                <option value="11">11.</option>
                <option value="12">12.</option>
                <option value="13">13.</option> 
                <option value="14">14.</option> 
                <option value="15">15.</option></select></p></p>
</div>
</div>


        <form action="" method="post" id="bestelformulier" action="zendemail.php" >
        <div class="adres">
        <div class="linkerkant">
            <div class="lnaam">
                <label for="naam">Je naam</label>
                <input type="text" name="naam" id="naam"/>
            </div>
            <div class="lorg">
                <label for="organisatie">Organisatie</label>
                <input type="text" name="organisatie" id="organisatie"/>
            </div>
            <div class="postadres" 
            <label for="straatlabel">Straat + Huisnummer</label>
            <input type="text" name="straat" id="straatennr"/>
            <label class="postcodelabel">Postcode</label>
            <input type="text" name="postcode" id="postcode" />
            <label class="woonplaatslabel">Woonplaats</label>
            <input type="text" name="woonplaats" id="woonplaats" />
            </div>
                    <div class="lafleveradres">
                <label for="afleveradres">Afleveradres</label>
                <input type="text" name="afleveradres1" id="afleveradres1" class="afleveradres"/>
                <input type="text" name="afleveradres2" id="afleveradres1" class="afleveradres"/>
            </div>
            <div class="lkielnodig">
                <label for="kielnodig" class="volbreed">Wanneer heb je de kiel nodig</label>
                <input type="text" name="kielnodig" id="kielnodig" />
            </div>
        </div>
        <div class="rechterkant">
            <div class="rtel">
                <label class="volbreed">Je telefoonnummer</label>
                <input type="text" name="telnr" id="telnr"/>
            </div>
            <div class="remail">
                <label class="volbreed" >Je email-adres</label>
                <input type="text" name="email"/>
            </div>
        </div>
        </div>
        <div class="berichtenknoppen">
                    <label class="volbreed" for="bericht">Je opmerkingen, vragen, suggesties:</label><br />
                    <textarea name="bericht" id="bericht" ></textarea>
            
                <div class="knoppen">
                    <a class="checkout_link arrowleft" title="Vorige" id="vorigestap" href="javascript:ns();"><span>Vorige</span></a>
                    <a class="checkout_link arrowright" value="Maak bestelling" id="drukbestellingdoor" >Email Form</a></input> 
                </div>
        </div>
                </form>
        </div>
    
</body>


Zendemail.php

code:
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

<?php 


echo '<p>Persoonsgegevens</p>
<table>
<tbody>
<tr>
<td>Naam persoon:</td>
<td>'. $naam .'</td>
</tr>
<tr>
<td>Naam organisatie:</td>
<td>'. $organisatie .'</td>
</tr>
<tr>
<td>Telefoonnummer:</td>
<td>'. $telnr .'</td>
</tr>
<tr>
<td>Emailadres:</td>
<td>'. $emailadres .'</td>
</tr>
<tr>
<td>Straat</td>
<td>'. $straatennr .'</td>
</tr>
<tr>
<tr>
<td>Postcode</td>
<td>'. $postcode .'</td>
</tr>
<tr>
<td>Woonplaats</td>
<td>'. $woonplaats .'</td>
</tr>
<tr>
<td>Afleveradres:</td>
<td>'. $afleveradres .'</td>
</tr>
<tr>
<td>Afleveradres 2:</td>
<td>'. $afleveradres2 .'</td>
</tr>
<tr>
<td>Datum nodig:</td>
<td><b>'. $kielnodig .'</b></td>
</tr>
<tr>
<td colspan="2">Eventuele opmerkingen</td>
</tr>
<tr>
<td colspan="2">'
. $bericht . '</td>
</tr>
</tbody>
</table>
'; 


?>

maandag 4 augustus 2014 12:27

Acties:
  • Aganim
  • Registratie: Oktober 2006
  • Laatst online: 22:39

Aganim

I have a cunning plan..

Heb je al geprobeerd om je php bestand gewoon te includen, ipv een curl_init uit te voeren? :)

maandag 4 augustus 2014 12:38

Acties:
  • MrMonkE
  • Registratie: December 2009
  • Laatst online: 04-11 15:26

MrMonkE

★ EXTRA ★

Probeer eens als regel 72:

}, 'json').fail(function() { alert( "foutje, bedankt!" ); });

Hij doet namelijk alleen jou functie als het goed is gegaan. Als het fout gaat doet ie niets.
zie ook: http://api.jquery.com/jquery.post/

★ What does that mean? ★

maandag 4 augustus 2014 13:16

Acties:
  • NMe
  • Registratie: Februari 2004
  • Laatst online: 20-11 11:59

NMe

Quia Ego Sic Dico.

The Great HooD schreef op maandag 04 augustus 2014 @ 12:22:
Vervolgens laat ik de server met een PHP script de waardes invullen en kan ik zien of het e.e.a. goed gaat. Hier loop ik dus vast. Er wordt helemaal niets verzonden en ook niet laten zien.
Dan loop je hier inmiddels lang genoeg rond om te weten dat we hier niet zo werken. Je kan zelf gaan debuggen en als je er daarna niet uitkomt een topic openen, of je doet het maar zonder topic op GoT. We zijn hier geen persoonlijke debugservice die even ruim 400 regels code voor je gaat doorspitten. En dat wéét je.

'E's fighting in there!' he stuttered, grabbing the captain's arm.
'All by himself?' said the captain.
'No, with everyone!' shouted Nobby, hopping from one foot to the other.

Dit topic is gesloten.

Apple iPhone 17 LG OLED evo G5 Google Pixel 10 Samsung Galaxy S25 Star Wars: Outlaws Nintendo Switch 2 Apple AirPods Pro (2e generatie) Sony PlayStation 5 Pro

Tweakers is onderdeel van DPG Media B.V.
Alle rechten voorbehouden - Auteursrecht © 1998 - 2025 • Hosting door TrueFullstaq