Re: Problem with form submittal

Re: Problem with form submittal

I am relatively new to web design and have a problem with a Form submittal. I have listed my code below. I have used Font Awesome to render the icons on the web page. I have used Parsley from  http://parsleyjs.org for the form validation which works perfectly.  I have used the jQuery Form Plugin from http://malsup.com/jquery/form/ to handle the form functioning. I receive the contact form email perfectly. However, I also have a dialogue box alert pop-up with the message "undefined", when I would expect the dialogue box alert pop-up with the message " Thank you! We have received your message! ". The CSS3 used is correct but I cannot see what is ausing the "undefined" error. Any help would be greatly appreciated! Thank you! Narelle!


*------------------------------------*
HTML5 Code
*------------------------------------*

<form action="contact_us/process_contact_form.php" method="post" data-validate="parsley">

<div class="span7">
  <p>Here you can contact us with any comments, suggestions or questions.</p>

<div class="row-fluid mtl">
<div class="control-group span12">
<label for="contactMsg" class="control-label">How can we help?</label>
<div class="controls">
<textarea class="span12" id="contactMsg" name="message" data-trigger="change" data-required="true" maxlength="500" data-maxlength="500" rows="5" data-regexp="^[\w\., ]+$"></textarea>
</div>
</div>
</div>

<div class="row-fluid">
<div class="control-group span6">
<label for="contactName" class="control-label">Your name</label>
<div class="controls">
<input type="text" id="contactName" name="contactName" placeholder="" data-trigger="change" data-required="true" maxlength="50" data-maxlength="50" class="span12" data-regexp="^((?!http://).|\s)+$">
</div>
</div>

<div class="control-group span6">
<label for="contactEmail" class="control-label">Your email address</label>
<div class="controls">
<input type="text" id="contactEmail" name="contactEmail" placeholder="" data-trigger="change" data-required="true" data-type="email" class="span12">
</div>
</div>
</div>

<div class="row-fluid">
<div class="control-group span12">
<div class="controls">
<a data-loading-text="&lt;i class='fa fa-spinner fa-spin'&gt;&lt;/i&gt;&nbsp;&nbsp;Submitting ..." class="btn btn-primary btn-loading span6">Submit</a>
<div class="sentMsg span6 hide">
<h6>
<i class="fa fa-check-circle-o fa-lg"></i>
  <span>Thank you! We have received your message!</span>
</h6>
</div>
</div>
</div>
</div>
</div>
</form>














































*------------------------------------*
PHP Code -  process_contact_form.php 
*------------------------------------*
<?php
if( isset($_POST) ){

//form validation vars
$formok = true;
$errors = array();

 //submission data
$ipaddress = $_SERVER['REMOTE_ADDR'];
$date = date('d/m/Y');
$time = date('H:i:s');

//form data
$message = $_POST['message'];
$name = $_POST['contactName'];
$email = $_POST['contactEmail'];

//validate form data

//validate name is not empty
if(empty($name)){
$formok = false;
$errors[] = "You have not entered your name";
}

//validate email address is not empty
if(empty($email)){
$formok = false;
$errors[] = "You have not entered an email address";
//validate email address is valid
}elseif(!filter_var($email, FILTER_VALIDATE_EMAIL)){
$formok = false;
$errors[] = "You have not entered a valid email address";
}

//validate message is not empty
if(empty($message)){
$formok = false;
$errors[] = "You have not entered a message";
}


//send email if all is ok
if($formok){
  $headers = "From: email@mydomain.com" . "\r\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";

  $emailbody = "<p>You have received a new message from the contact form on your website.</p>
<p><strong>Name: </strong> {$name} </p>
<p><strong>Email Address: </strong> {$email} </p>
<p><strong>Message: </strong> {$message} </p>
<p>This message was sent from IP Address: {$ipaddress} on {$date} at {$time}</p>";

mail(" email@mydomain.com ","New Enquiry",$emailbody,$headers);

}
}
























































?>




$(document).ready(function() {


$("form").submit(function(e){

e.preventDefault();

contactConfirm();

});



$('.btn-loading').on('click', function() {
contactConfirm();

});


});



function contactConfirm() {

if ($('form').parsley('validate')) {

$('.btn-loading').button('loading');

$('form').ajaxSubmit(function (responseResult) {

if (responseResult.code == '0') {

$('.btn-loading').addClass('hide');
$('.btn-loading').button('reset');

$('.sentMsg').removeClass('hide');

}
else {

alert(responseResult.message);
$('.btn-loading').button('reset');
}
});
}
}