formulier verzenden zonder refreshen
ik probeer een formulier te versturen zonder dat het de pagina refreshed.
alleen lukt het me niet.
dit is mijn stukje javascript:
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
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
<?php
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#myform").validate({
debug: false,
rules: {
name: "required",
email: {
required: true,
email: true
}
},
messages: {
name: "Please let us know who you are.",
email: "A valid email will help us get in touch with you.",
},
submitHandler: function(form) {
// do other stuff for a valid form
$.post('process.php', $("#myform").serialize(), function(data) {
$('#downloadtext').innerHTML(data);
});
}
});
});
</script>
?>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#myform").validate({
debug: false,
rules: {
name: "required",
email: {
required: true,
email: true
}
},
messages: {
name: "Please let us know who you are.",
email: "A valid email will help us get in touch with you.",
},
submitHandler: function(form) {
// do other stuff for a valid form
$.post('process.php', $("#myform").serialize(), function(data) {
$('#downloadtext').innerHTML(data);
});
}
});
});
</script>
?>
en dit is het stukje van de downloadbox
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
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
<?php
echo '<div id="aanboddetailtitel"><h2>'.$titel.'</h2></div>';
include('imagesliderdetail.php');
echo '<div class="box style1">
<div class="top"></div>
<div class="xcontent">
<div class="bg" height="300px">
<div class="inner" id="downloadtext">
<h2>Brochure</h2>
<p>Download hier de brochure van deze woning</p>
<div class="wrapper"><a href="javascript:void(0)" onclick="switchtext();" class="link1"><span><b>download</b></span></a></div>
</div>
</div>
</div>
<div class="bot"></div>
</div>
<div id="prijs">Prijs: '.$prijs.'</div>
<div id="referentienummer">Referentienummer: '.$referentienummer.'</div>
<div><br/><b>Kenmerken</b></div>
<div class="kenmerken">
<ul>';
for ($i=0;$i<count($kenmerken);$i++){
if ($i%6 == 0 && $i!=0){
echo '</ul></div><div class="kenmerken"><ul>';
}
echo('<li>'.$kenmerken[$i].'</li>');
}
echo ('</ul></div><div id="omschrijving"><p>
<b>Omschrijving</b></p><p>'.$omschrijving. '</p></div><div id="indeling"><p>
<b>Indeling</b></p><p>
'.$indeling.'</p></div>');
?>
echo '<div id="aanboddetailtitel"><h2>'.$titel.'</h2></div>';
include('imagesliderdetail.php');
echo '<div class="box style1">
<div class="top"></div>
<div class="xcontent">
<div class="bg" height="300px">
<div class="inner" id="downloadtext">
<h2>Brochure</h2>
<p>Download hier de brochure van deze woning</p>
<div class="wrapper"><a href="javascript:void(0)" onclick="switchtext();" class="link1"><span><b>download</b></span></a></div>
</div>
</div>
</div>
<div class="bot"></div>
</div>
<div id="prijs">Prijs: '.$prijs.'</div>
<div id="referentienummer">Referentienummer: '.$referentienummer.'</div>
<div><br/><b>Kenmerken</b></div>
<div class="kenmerken">
<ul>';
for ($i=0;$i<count($kenmerken);$i++){
if ($i%6 == 0 && $i!=0){
echo '</ul></div><div class="kenmerken"><ul>';
}
echo('<li>'.$kenmerken[$i].'</li>');
}
echo ('</ul></div><div id="omschrijving"><p>
<b>Omschrijving</b></p><p>'.$omschrijving. '</p></div><div id="indeling"><p>
<b>Indeling</b></p><p>
'.$indeling.'</p></div>');
?>
<script type="text/javascript">
function switchtext(){
document.getElementById('downloadtext').innerHTML = '<h5>Brochure aanvragen</h5><br/><div id="contactform"><form name="myform" id="myform" method="POST"><label for="name" id="name_label">Name</label><input type="text" name="name" id="name" size="30" value=""/><br><label for="email" id="email_label">Email</label><input type="text" name="email" id="email" size="30" value=""/><br><input type="submit" name="submit" value="Submit"></form></div><div class="wrapper"></div>';
}
</script>
?>
het is dus de bedoeling dat als je op download klikt je een formulier krijgt die je kan invullen en als je dat formulier verstuurd dat je een mail krijgt met de brochure.
je kan hier mijn poging zien http://www.purespain.com/nl/2011/aanboddetail.php?id=157
ik volg de tutorial van deze site http://www.askaboutphp.com/213/php-and-jquery-submit-a-form-without-refreshing-the-page.html
alleen werkt het niet als ik het zelf toepas
kan iemand me helpen aub.
alvast bedankt
Jonas
Gewijzigd op 02/04/2011 14:52:00 door Jonas vermeulen
heb code tags ook geprobeerd, maar dat werkte hier niet, wat moet ik er anders rond zetten?
Gewijzigd op 02/04/2011 15:05:39 door jonas vermeulen
dus regel 2 wordt
Code (php)
1
echo '<div id=\"aanboddetailtitel\"><h2>'.$titel.'</h2></div>';
Sander A op 02/04/2011 15:07:53:
Volgensmij moet je \ gebruiken in html
dus regel 2 wordt
dus regel 2 wordt
Code (php)
1
echo '<div id=\"aanboddetailtitel\"><h2>'.$titel.'</h2></div>';
Wat een onzin! Dit heet escapen, en gebruik je zeker niet nu.