Form met slide

Door bart berden op 14-08-2010 18:32 gewijzigd op 14-08-2010 20:40

1.751 views

Hallo mensen,

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:


<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>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</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

Tobias Tobias

14-08-2010 19:19

zet hem even tussen code-tags, dan is het wat leesbaarder

Jelmer -

14-08-2010 19:43 gewijzigd op 14-08-2010 19:43

Als je even in 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.

$.post("test.php", $("#testform").serialize());

Bas IJzelendoorn

14-08-2010 20:42

Als ik je een anti-spam tipje mag geven?!

Gebruik geen mailto:

(regel: 70)


<a href="mailto:[email protected]">

bart berden

15-08-2010 14:42

The Dutch Guy op 14/08/2010 20:42:21

Als ik je een anti-spam tipje mag geven?!

Gebruik geen mailto:

(regel: 70)
<a href="mailto:[email protected]">

Thanx

[size=xsmall]Toevoeging op 15/08/2010 14:50:41:[/size]

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.



<script type="text/javascript">
$.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:

{
			$(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.

Reageren

Inloggen om te reageren