How do i disable page redirect in contact form?

[Anonymous]

Im using a contact form with the PHP code bellow.

$field_name = $_POST;
$field_email = $_POST;
$field_message = $_POST;

$mail_to = ‘[email protected]’;
$subject = ‘Message via online resume from ‘.$field_name;

$body_message = ‘From: ‘.$field_name.”n”;
$body_message .= ‘E-mail: ‘.$field_email.”n”;
$body_message .= ‘Message: ‘.$field_message;

$headers = ‘From: ‘.$field_email.”rn”;
$headers .= ‘Reply-To: ‘.$field_email.”rn”;

$mail_status = mail($mail_to, $subject, $body_message, $headers);

if ($mail_status) { ?>

}
else { ?>

}
?>

On this website. [http://reallycoolstuff.net/PROJECTS/jobmagnet/ ](http://reallycoolstuff.net/PROJECTS/jobmagnet/ “website”)
when the send button is clicked, the page changes and an alert message appears. How can i keep the same page and instead of the alert message, have the send text in the submit button change to “message received”?

[chrisburton]

@Jarolin Probably use ajax `.load()` for contact.php if the status comes back as successful and don’t use Javascript alerts for the message, just echo it.

That’s just a guess, though.

[Anonymous]

@CrocoDillon Thanks for that but i wouldn’t know how to implement it as i am a complete Jquery and PHP noob. I basically have almost everything set up with the contact form and it seems to be working very well so far. I just need to disable the page redirect and have the send button text change when the message is sent. Can’t that be done using the code i already have?

[Anonymous]

@traq This is how my code looks when i changed what you said.

$field_name = $_POST;
$field_email = $_POST;
$field_message = $_POST;

$mail_to = ‘[email protected]’;
$subject = ‘Message via online resume from ‘.$field_name;

$body_message = ‘From: ‘.$field_name.”n”;
$body_message .= ‘E-mail: ‘.$field_email.”n”;
$body_message .= ‘Message: ‘.$field_message;

$headers = ‘From: ‘.$field_email.”rn”;
$headers .= ‘Reply-To: ‘.$field_email.”rn”;

$mail_status = mail($mail_to, $subject, $body_message, $headers);

if ($mail_status) { print “Your message was sent.”; } ?>
}
else { print “There was a problem, please try again.”; }?>
}
?>

I this right? I tried it and get an internal server error.

[chrisburton]

Just out of curiosity, why are you writing your PHP like that? There’s no reason to use opening and closing PHP tags when there’s no HTML involved.

Just do this:

if($mail_status) {
print “Your message was sent.”;
}
else {
print “There was a problem, please try again.”;
}

[Anonymous]

@chrisburton I didn’t write the PHP. i used it off a tutorial. I also tried your solution and i didnt get the pop-up message but the page still redirected to contact.php with the text “your mesage was sent”.

@CrocoDillon i did what you said and something really weird is going on after i click the send button. The page gets this white layer ontop of it. No idea what that is. You can see for your self.

[Anonymous]

@CrocoDillon i removed the contact.php because i thought it might interfere with the code you sent me. Its back now. Yea something happens to the send button. Do i still need to do what you mentioned above?

[Anonymous]

@CrocoDillon I changed the attr to text and it seems to work. I get “value” as the button text. Although i’m not receiving the messages in my inbox now.

[Anonymous]

Oh. What i did was remove .ttr and replace it with .text. Your right i didn’t read your instructions properly. I was supposed to add .text bellow it. But anyway i did just that and the page goes back to redirecting with the text. Heres how the PHP code in the index.js file looks like.

var form = $(‘#contact_me form’),
submit = form.find(‘[type=”submit”]’);

form.on(‘submit’, function(e) {
e.preventDefault();

// avoid spamming buttons
if (submit.attr(‘I received your message.’) !== ‘Send’) -> if
(submit.text() !== ‘Send’)
return;

// very simple validator, just checks if no input is empty
var valid = true;
form.find(‘input, textarea’).removeClass(‘invalid’).each(function() {
if (!this.value) {
$(this).addClass(‘invalid’);
valid = false;
}
});

if (!valid) {
// notify user (or use .invalid class as style hook)
} else {
submit.attr(‘value’, ‘Sending…’) -> if // notify user it’s sending
submit.text(‘Sending…’)
.css({boxShadow: ‘0 0 200em 200em rgba(225, 225, 225, 0.6)’, // creates a lightbox around the form
backgroundColor: ‘#ccc’});

// this actually submits the form data
$.post(
form.attr(‘action’),
form.serialize(),
function(data){
submit.attr(‘value’, data) -> submit.text(data)
.css({boxShadow: ‘none’});
setTimeout(function() {
// reset form if you want (optional)
form.find(‘input, textarea’).val(”);
submit.attr(‘value’, ‘Send’) -> submit.text(‘send’)
.css({backgroundColor: ”});
}, 3000);
}
);
}

Now i receive the messages but the page redirects and the send button remains the same.

[Anonymous]

ok ill try that

[Anonymous]

Works great. Thank you for your help, would have taken me weeks to do this alone. saved me allot of time

[Author]

Posts