Form met slide
Ik loop tegen een (misschien heel simpel) probleem aan waar ik maar niet uitkom.
Het probleem is dat hij een mail stuurt en slide, maar de content van de mail leeg is.
als ik { }, weghaal, slide hij niet maar verstuurt hij de mail wel goed. Bij deze 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
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
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
<script type="text/javascript">
$().ready(function() {
$.validator.setDefaults({
submitHandler: function(data) {
$.post("",
{ },
function(data){
$("#commentForm").slideUp("normal", function() {
$("#commentForm").before('<h1>Success</h1><p>Your email was sent.</p>');
});
}
); }
});
// validate the comment form when it is submitted
$("#commentForm").validate();
});
</script>
<div id="products">
<div id="products_top">
<h2><?php echo $page_titel; ?></h2>
</div>
<div class="products_middle">
<div class="products_sub2"><?php echo $page_content1; ?></div>
<div class="contact_left">
<h3>Contactformulier</h3><br />
<form action="" class="cmxform" id="commentForm" method="post" >
<label for="cname">Naam*</label>
<input id="cname" name="name" class="required" minlength="2" /><br />
<label for="cemail">E-Mail*</label>
<input id="cemail" name="email" class="required email" /><br />
<label for="curl">Onderwerp*</label>
<input id="curl" name="url" class="required" value="" /><br />
<label for="ccomment">Bericht*</label>
<textarea id="ccomment" name="comment" class="required" cols="26" rows="6"></textarea><br />
<input id="submit" class="submit" type="submit" value="Verzenden"/>
</form>
<div> </div>
</div>
<div class="contact_right">
<h3>Contactgegevens</h3><br />
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="120">Telefoonnummer:</td>
<td>+31(0)77 - 3071219</td>
</tr>
<tr>
<td valign="top">Adres:</td>
<td>Markt 21<br />5981 AN<br />Panningen</td>
</tr>
<tr>
<td valign="top">Email:</td>
<td><a href="mailto:[email protected]">[email protected]</a></td></tr>
</table>
<br />
<br />
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="120">Openingstijden</td>
<td width="40">ma:</td>
<td>13.15 - 18.00</td>
</tr>
<tr>
<td valign="top"></td>
<td>di-do:</td>
<td>09.15 - 12.15</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>13.15 - 18.00</td>
</tr>
<tr>
<td valign="top"></td>
<td>vr:</td>
<td>09.15 - 12.15</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>13.15 - 21.00</td>
</tr>
<tr>
<td valign="top"></td>
<td>za:</td>
<td>09.30 - 16.30</td>
</tr>
</table>
<br />
<br /><br />
<br />
</div>
<div class="clear"></div>
<div class="bottomcontentbar">Velden met een * zijn verplicht</div>
</div>
<div id="products_bottom_grey"></div>
</div>
<?php
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$naar = $adminmail;
$titelmail = "[".$displaysite."] Contactformulier";
$van = "FROM: ". $_POST['name']." <". $_POST['email'].">";
$body =
"Bericht verstuurd op: ".date("d-m-Y")." om ".date("H:i:s")." door
Naam: ".$_POST['name']."
E-mail: ". $_POST['email']."
Onderwerp: ". $_POST['url']."
Bericht :
". $_POST['comment'];
mail ($naar, $titelmail, $body, $van);
} ?>
$().ready(function() {
$.validator.setDefaults({
submitHandler: function(data) {
$.post("",
{ },
function(data){
$("#commentForm").slideUp("normal", function() {
$("#commentForm").before('<h1>Success</h1><p>Your email was sent.</p>');
});
}
); }
});
// validate the comment form when it is submitted
$("#commentForm").validate();
});
</script>
<div id="products">
<div id="products_top">
<h2><?php echo $page_titel; ?></h2>
</div>
<div class="products_middle">
<div class="products_sub2"><?php echo $page_content1; ?></div>
<div class="contact_left">
<h3>Contactformulier</h3><br />
<form action="" class="cmxform" id="commentForm" method="post" >
<label for="cname">Naam*</label>
<input id="cname" name="name" class="required" minlength="2" /><br />
<label for="cemail">E-Mail*</label>
<input id="cemail" name="email" class="required email" /><br />
<label for="curl">Onderwerp*</label>
<input id="curl" name="url" class="required" value="" /><br />
<label for="ccomment">Bericht*</label>
<textarea id="ccomment" name="comment" class="required" cols="26" rows="6"></textarea><br />
<input id="submit" class="submit" type="submit" value="Verzenden"/>
</form>
<div> </div>
</div>
<div class="contact_right">
<h3>Contactgegevens</h3><br />
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="120">Telefoonnummer:</td>
<td>+31(0)77 - 3071219</td>
</tr>
<tr>
<td valign="top">Adres:</td>
<td>Markt 21<br />5981 AN<br />Panningen</td>
</tr>
<tr>
<td valign="top">Email:</td>
<td><a href="mailto:[email protected]">[email protected]</a></td></tr>
</table>
<br />
<br />
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="120">Openingstijden</td>
<td width="40">ma:</td>
<td>13.15 - 18.00</td>
</tr>
<tr>
<td valign="top"></td>
<td>di-do:</td>
<td>09.15 - 12.15</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>13.15 - 18.00</td>
</tr>
<tr>
<td valign="top"></td>
<td>vr:</td>
<td>09.15 - 12.15</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>13.15 - 21.00</td>
</tr>
<tr>
<td valign="top"></td>
<td>za:</td>
<td>09.30 - 16.30</td>
</tr>
</table>
<br />
<br /><br />
<br />
</div>
<div class="clear"></div>
<div class="bottomcontentbar">Velden met een * zijn verplicht</div>
</div>
<div id="products_bottom_grey"></div>
</div>
<?php
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$naar = $adminmail;
$titelmail = "[".$displaysite."] Contactformulier";
$van = "FROM: ". $_POST['name']." <". $_POST['email'].">";
$body =
"Bericht verstuurd op: ".date("d-m-Y")." om ".date("H:i:s")." door
Naam: ".$_POST['name']."
E-mail: ". $_POST['email']."
Onderwerp: ". $_POST['url']."
Bericht :
". $_POST['comment'];
mail ($naar, $titelmail, $body, $van);
} ?>
Alvast bedankt!
Bart
Gelieve in het vervolg code tussen code tags te plaatsen.[/modedit]
Gewijzigd op 14/08/2010 20:40:29 door Bas IJzelendoorn
zet hem even tussen code-tags, dan is het wat leesbaarder
de handleiding van jQuery kijkt, zie je dat post's 2e argument de data moet bevatten.
In jou geval moet je denk ik kijken naar "Example: send form data using ajax requests" op die pagina, waar ze form.serialize() gebruiken om de velden van een formulier om te zetten in een Javascript object, en dat als data mee te sturen.
Als je even in In jou geval moet je denk ik kijken naar "Example: send form data using ajax requests" op die pagina, waar ze form.serialize() gebruiken om de velden van een formulier om te zetten in een Javascript object, en dat als data mee te sturen.
Gewijzigd op 14/08/2010 19:43:46 door Jelmer -
The Dutch Guy op 14/08/2010 20:42:21:
Als ik je een anti-spam tipje mag geven?!
Gebruik geen mailto:
(regel: 70)
Gebruik geen mailto:
(regel: 70)
Thanx
Toevoeging op 15/08/2010 14:50:41:
Ik heb de scripts van 2 verschillende bronnen, namelijk deze:
http://bassistance.de/jquery-plugins/jquery-plugin-validation/
en de slide van deze:
http://trevordavis.net/blog/ajax-forms-with-jquery/
Het eerste script zit geen post of iets dergelijks in, dus dat moet je zelf toevoegen, dit heb ik handmatig gedaan (zie code) Wat de eerste code doet, is valideren, en als deze gevalideerd is, een popup weer laten geven zodat je kunt zien dat deze gevalideerd is. Nu wil ik dus in plaats van die popup de slide van de 2e link gebruiken.
Code (php)
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
<script type="text/javascript">
$.validator.setDefaults({
submitHandler: function() { alert("submitted!"); }
});
$().ready(function() {
// validate the comment form when it is submitted
$("#commentForm").validate();
});
</script>
$.validator.setDefaults({
submitHandler: function() { alert("submitted!"); }
});
$().ready(function() {
// validate the comment form when it is submitted
$("#commentForm").validate();
});
</script>
In dat stuk wil ik deze code gebruiken:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
2
3
4
5
6
7
8
9
10
11
12
13
14
{
$(this).hide();
$("#sendEmail li.buttons").append('<img src="/wp-content/themes/default/images/template/loading.gif" alt="Loading" id="loading" />');
$.post("/wp-content/uploads/2008/01/sendemail.php",
{ emailTo: emailToVal, emailFrom: emailFromVal, subject: subjectVal, message: messageVal },
function(data){
$("#sendEmail").slideUp("normal", function() {
$("#sendEmail").before('<h1>Success</h1><p>Your email was sent.</p>');
});
}
);
}
$(this).hide();
$("#sendEmail li.buttons").append('<img src="/wp-content/themes/default/images/template/loading.gif" alt="Loading" id="loading" />');
$.post("/wp-content/uploads/2008/01/sendemail.php",
{ emailTo: emailToVal, emailFrom: emailFromVal, subject: subjectVal, message: messageVal },
function(data){
$("#sendEmail").slideUp("normal", function() {
$("#sendEmail").before('<h1>Success</h1><p>Your email was sent.</p>');
});
}
);
}
Maar ik krijg dit maar niet voor elkaar.