SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Zealot
    Join Date
    Nov 2008
    Posts
    140
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    jQuery form submission problem

    So when i submit the form i get "sorry an error occured" as opposed to the mail_success message even though the form data was mailed and received.

    form:
    Code:
    <form action="contact.php" method="POST" id='contact_form'>
    				<ul>						
    					<li> 
    						<label for="name">Name</label>
    						<input type='text' name='name' id='name' />
    						<div class="clear"></div>
    						<p id='name_error' class='error'>Enter your name</p>
    					</li> 
    					<li> 
    						<label for="email">Email Address</label>
    						<input type='text' name='email' id='email' />
    						<div class="clear"></div>
    						<p id='email_error' class='error'>Enter a valid email address</p>
    					</li> 
    					<li> 
    						<label for="message">Message</label>
    						<textarea name='message' id='message' rows="30" cols="30"></textarea>
    						<div class="clear"></div>
    						<p id='message_error' class='error'>Enter your message</p>
    					</li> 
                        <li>
                        <p id='mail_success' class='success'>Thank you for contacting me, I will get back to you as soon as possible.</p>
    					<p id='mail_fail' class='error'>Sorry, an error has occured. Please try again later.</p>
    					<div id="button">
    					<input type='submit' id='send_message' class="button" value='Submit' />
    					</div>
                        </li>
                        </ul>
                </form>
    contact.php:
    Code:
    <?php
    
    $EmailFrom = Trim(stripslashes($_POST['email'])); 
    $EmailTo = "you@yourdomain.com";
    $Subject = "Contact Form";
    $name = Trim(stripslashes($_POST['name'])); 
    $email = Trim(stripslashes($_POST['email'])); 
    $message = Trim(stripslashes($_POST['message'])); 
    
    
    $validationOK=true;
    if (Trim($name)=="") $validationOK=false;
    if (Trim($email)=="") $validationOK=false;
    if (Trim($message)=="") $validationOK=false;
    if (!$validationOK) {
      print "failed";
      exit;
    }
    
    
    $Body = "";
    $Body .= "name: ";
    $Body .= $name;
    $Body .= "\n";
    $Body .= "email: ";
    $Body .= $email;
    $Body .= "\n";
    $Body .= "message: ";
    $Body .= $message;
    $Body .= "\n";
    
    
    $success = mail($EmailTo, $Subject, $Body, "From: <$email>");
    
    if ($success){
      print "sent";
    }
    else{
      print "failed";
    }
    ?>
    contact.js:
    Code:
    $(document).ready(function(){
    			$('#send_message').click(function(e){
    				
    				e.preventDefault();
    				
    				var error = false;
    				var name = $('#name').val();
    				var email = $('#email').val();
    				var message = $('#message').val();
    				
    				
    				if(name.length == 0){
    					var error = true;
    					$('#name_error').fadeIn(500);
    				}else{
    					$('#name_error').fadeOut(500);
    				}
    				if(email.length == 0 || email.indexOf('@') == '-1'){
    					var error = true;
    					$('#email_error').fadeIn(500);
    				}else{
    					$('#email_error').fadeOut(500);
    				}
    				if(message.length == 0){
    					var error = true;
    					$('#message_error').fadeIn(500);
    				}else{
    					$('#message_error').fadeOut(500);
    				}
    				
    				if(error == false){
    
    					$('#send_message').attr({'disabled' : 'true', 'value' : 'Sending...' });
    					
    					$.post("contact.php", $("#contact_form").serialize(),function(result){
    
    						if(result == 'sent'){
    
    							 $('#button').remove();
    
    							$('#mail_success').fadeIn(500);
    						}else{
    
    							$('#mail_fail').fadeIn(500);
    			
    							$('#send_message').removeAttr('disabled').attr('value', 'Submit');
    						}
    					});
    				}
    			});    
    		});
    any help greatly appreciated...this has been driving me insane!

  2. #2
    Theoretical Physics Student bronze trophy Jake Arkinstall's Avatar
    Join Date
    May 2006
    Location
    Lancaster University, UK
    Posts
    7,062
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Without going through your code thoroughly, I noticed that your code is simply checking if the output is 'sent'.

    What do you get when you alert('-' + result + '-'); ?

    I put the dashes in there so you know if there's an added space or something as well.

    Maybe your PHP is spitting out a notice or something, therefore even though the script runs and outputs 'sent', because other text is also output then the total output wouldn't equal 'sent' itself.
    Jake Arkinstall
    "Sometimes you don't need to reinvent the wheel;
    Sometimes its enough to make that wheel more rounded"-Molona

  3. #3
    SitePoint Zealot
    Join Date
    Nov 2008
    Posts
    140
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Not sure i follow you - im relatively new to coding...any help/dumbing down is appreciated

  4. #4
    Theoretical Physics Student bronze trophy Jake Arkinstall's Avatar
    Join Date
    May 2006
    Location
    Lancaster University, UK
    Posts
    7,062
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Change:
    Code javascript:
                            if(result == 'sent'){
                                $('#button').remove();
                                $('#mail_success').fadeIn(500);
                            }else{
                                $('#mail_fail').fadeIn(500);
                            $('#send_message').removeAttr('disabled').attr('value', 'Submit');
                            }

    To:

    Code javascript:
                            if(result == 'sent'){
                                $('#button').remove();
                                $('#mail_success').fadeIn(500);
                            }else{
                                $('#mail_fail').fadeIn(500);
                            $('#send_message').removeAttr('disabled').attr('value', 'Submit');
                            }
                            alert('-' + result + '-');

    What does it alert?
    Jake Arkinstall
    "Sometimes you don't need to reinvent the wheel;
    Sometimes its enough to make that wheel more rounded"-Molona

  5. #5
    SitePoint Zealot
    Join Date
    Nov 2008
    Posts
    140
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Same thing happens:
    "Sorry, an error has occured. Please try again later."

    But i did not receive the email...

  6. #6
    SitePoint Zealot
    Join Date
    Nov 2008
    Posts
    140
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    any more help would be greatly appreciated, anyone?

  7. #7
    SitePoint Evangelist
    Join Date
    Jul 2007
    Posts
    345
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You should trim the response before checking its value. Also, you don't currently fadeOut the error message on success.
    Code:
    if($.trim(result) == 'sent'){
       $('#button').remove();
       $('#mail_fail').fadeOut(500);
       $('#mail_success').fadeIn(500);
    }

  8. #8
    SitePoint Zealot
    Join Date
    Nov 2008
    Posts
    140
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Your a star, thanks.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •