contact form in a single page website

[M rosi]

hi,
i have designed a single page website, like this
http://themeforest.s3.amazonaws.com/116_parallax/tutorial-source-files/tut-index.html

but i'm struggling with the contact form. once user submit a message/query, it should send to an email (very simple contact form includes name,email and message).

the method that i know is not sufficient to do this. please some one help........it would be a great help....

thank you

[bluewalrus]

What method is failing? Can your provide the form?

http://www.tizag.com/phpT/postget.php
http://www.w3schools.com/PHP/php_mail.asp

[molendijk]

You can follow the links provided by bluewalrus.
If you don't understand, you can do the following.

1. Put the following script in the head of your page:

<script type="text/javascript">
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
function checkFields() {
missinginfo = "";
if (document.form.name.value == "") {
missinginfo += "\n - Your Name";
}
if ((document.form.email.value == "") ||
(document.form.email.value.indexOf('@') == -1) ||
(document.form.email.value.indexOf('.') == -1)) {
missinginfo += "\n - Your Email";
}
if(document.form.message.value == "") {
missinginfo += "\n - Your Message.";
}
if (missinginfo != "") {
missinginfo ="\n" +
"You did not (correctly) fill in the following field(s):\n" +
missinginfo + "\n" + "\nPlease make the necessary corrections.";
alert(missinginfo);
return false;
}
else return true;
}
</script>
2. Put something like this in the body of your page:

<form action="mail.php" method="post" target="new" name="form" onSubmit="return checkFields()">
Your Name <br><input type="text" name="name" size="20"> <br><br>
Your Email Address<br><input type="text" name="email" size="20"><br><br>
Your Message<br><textarea name="message" cols="72" rows="7" ></textarea>
<br>
<input type=submit value="Send" > <input type="reset" value="Clear">
</form>
3. The form given in 2 above refers to a php-file called mail.php. Create that file and put something like the following in it:

<?
$email = $_REQUEST['email'] ;
$message = $_REQUEST['message'] ;
mail( "your_email_address@bla.bla", "You have received a message via a contact form", $message, "From: $email" );
header( "Location: http://www.bla/bla.html" );
?>
4. In the file called http://www.bla/bla.html in 3 above (of course you would choose another name for the file), you put something like 'W'll contact you as soon as possible'.
===
Arie Molendijk.

[M rosi]

What method is failing? Can your provide the form?

http://www.tizag.com/phpT/postget.php
http://www.w3schools.com/PHP/php_mail.asp

the method that i had used,
http://www.ibdhost.com/contact/


You can follow the links provided by bluewalrus.
If you don't understand, you can do the following.....




bluewalrus and molendijk,
thank you for reply me :)
but as i said, my site is single page website. it has only index.php.
To use

<form action="somepage.php" method="post" ..... >
it should has another page called somepage.php. but it doesn't.

let me explain how i constructed it,

menu part(in index.php)

<ul id="userpage-layout-navigation2" >
<li id="userpage-layout-navigation-item-home" class="userpage-layout-navigation-item">
<a href="site" onClick="return false;" class="userpage-layout-navigation-item-link color_5">Home</a></li>

<li id="userpage-layout-navigation-item-954654" class="userpage-layout-navigation-item">
<a href="site" onClick="return false;" class="userpage-layout-navigation-item-link color_5">About</a></li>

<li id="userpage-layout-navigation-item-1003247" class="userpage-layout-navigation-item">
<a href="site" onClick="return false;" class="userpage-layout-navigation-item-link color_5">Contact</a></li>

<li .........................................


"About" section starts(in index.php),

<div id="userpage-layout-service-954654" class="Biography panel-global widescreen-slider-block panel-vertical panel-820 background_2">
<div id="eng-About" class="service"><div class="section"><div class="panel-header">
<h2 class="panel-header-title">About Us</h2>
</div><div class="panel-custom-plain panel-html panel-html-vertical">
<div class="panel-custom-plain-subheading">Our Story</div>...............................

"contact" section starts(in index.php),

<div id="userpage-layout-service-943930" class="panel-global widescreen-slider-block panel-vertical panel-820 background_2">
<div id="eng-Contact" class="service">
<div class="section">
<div class="panel-header ">
<h2 class="panel-header-title">Contact</h2>
</div>

<div class="panel-custom-plain panel-html panel-html-vertical">
<form method="post" action="?????" id="contact_form"> ...........................

directs to corresponding section from menu(in index.php),

<script type="text/javascript">
var accounts = {};
accounts["eng-About"] = { "serviceId":"954654", "type": "About" };
accounts["eng-Contact"] = { "serviceId":"943930", "type": "Contact" };
.................................
..................................
</script>

hope it's clear.
would you help me to solve this problem. please.....
thank you

.

[molendijk]

Doing it that way is beyond my php-knowledge, sorry.
===
Arie.

[alexjewell]

You're going to want to use AJAX:

http://www.webresourcesdepot.com/16-free-ajax-contact-forms-for-a-better-user-experience/

One of those will allow you to submit the form through javascript to a php script, then replace content in a particular object in the document without refreshing it.

Hope that helps.