Jump to content


Photo

Help with form submission and AJAX


  • Please log in to reply
1 reply to this topic

#1 mdmartiny

mdmartiny

    Advanced Member

  • Members
  • PipPipPip
  • 168 posts
  • LocationFort Gratiot, MI, USA

Posted 18 April 2013 - 04:38 PM

I am trying to add a contact form to a page. i can't get the script to do anything. When I click on the submit button all it does is sit there no error messages or anything.

If the fields are not filled in then there is supposed to be an error message. If everything is ok then there is supposed to be a success message. 

This is the Jquery code that I am using

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
	<script language="javascript" type="text/javascript" >

	$(function(){
		$("#ContactForm").submit(function(){
			$("#submitf").value='Please wait...';
			
			$.post("/contact.php?send=comments", $("#ContactForm").serialize(),
			function(data){
				if(data.frm_check == 'error'){ 
						$("#message_post").html("<div class='errorMessage'>ERROR: " + data.msg + "!</div>"); 
						document.ContactForm.submitf.value='Resend >>';
						document.ContactForm.submitf.disabled=false;
				} else {
					$("#message_post").html("<div class='successMessage'>Your message has been sent successfully!</div>"); 
					$("#submitf").value='Send >>';
					}
			}, "json");
			
			return false;
			
		});
	});

	</script>

 

 

Here is the contact page that I am also using

<?php
$adminemail = "mail@example.com";
 
if ($_GET['send'] == 'comments'){
 
 $_uname = $_POST['name'];
 $_uemail = $_POST['email'];
 $_comments = stripslashes($_POST['message']);
 
 $email_check = '';
 $return_arr = array();
 
	if($_uname=="" || $_uemail=="" || $_comments==""){
	 	$return_arr["frm_check"] = 'error';
	 	$return_arr["msg"] = "Please fill in all required fields!";
	 } else if(filter_var($_uemail, FILTER_VALIDATE_EMAIL)) {
	 
		 $to = $adminemail;
		 $from = $_uemail;
		 $subject = "New Contact Us Message: " .$_title;
		 $message = $_comments;
		 
		 $headers = "MIME-Version: 1.0\r\n";
		 $headers .= "Content-type: text/html; charset=iso-8859-1\r\n";
		 $headers .= "Content-Transfer-Encoding: 7bit\r\n";
		 $headers .= "From: " . $from . "\r\n";
		 
		@mail($to, $subject, $message, $headers);
	 
	 } else {
	 	$return_arr["frm_check"] = 'error';
	 	$return_arr["msg"] = "Please enter a valid email address!";
	}
 
	echo json_encode($return_arr);
}
 
?> 

This is my form 

<form action='' method='post' name='ContactForm' id='ContactForm' >
                            <fieldset class="info_fieldset">
                                    <input class="textbox" type="text" name="name" value="" placeholder="Name" /><br />
                                    <input class="textbox" type="text" name="email" value="" placeholder="you@email.com" /><br />
                                    <textarea class="textbox2" name="comments" rows="5" cols="25" placeholder="You can say Hi !"></textarea>
                                    <input type='submit' value='Submit' class='myinputbtn' name='submitf' id="submitf">
                                <div id='message_post'></div>
                            </fieldset>
                        </form>

I am trying to learn how to use Jquery so I am not sure what I have going on here or if I am even doing it right.


Edited by mdmartiny, 18 April 2013 - 04:41 PM.


#2 jugesh

jugesh

    Advanced Member

  • Members
  • PipPipPip
  • 65 posts

Posted 23 April 2013 - 02:47 AM

On the form submit event you have to give validation.. If form is validated then only ajax will call






0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Cheap Linux VPS from $5
SSD Storage, 30 day Guarantee
1 TB of BW, 100% Network Uptime

AlphaBit.com