jquery contact form trouble

This is my form

<form id="formContact" name="formContact" method="post" action="#">
            <input id="name" name="name" type="text" value="Your name goes here..." />
            <input id="email" name="email" type="text" value="E-mail to reply..." />
            <textarea id="message" name="message" rows="" cols="">Your message goes here...</textarea>
            <input class="send" name="send" type="submit" value="Send" />
        </form>
    </div>
    <span class="clear"></span>
</div>
<script type="text/javascript" src="jquery.js"></script>

i have a contact.js page but no php form, how do i validate this so when you press send it sends to set email address ?

THIS IS MY CONTACT.JS FORM PAGE

$().ready(function(){
    //global vars
    var name = $("#name");
    var nameText = "Your name goes here...";
    var email = $("#email");
    var emailText = "E-mail to reply...";
    var message = $("#message");
    var messageText = "Your message goes here...";

    //Form validation
    $("#formContact").submit(function(){
        if(!validateName() | !validateEmail() | !validateMessage()){
            return false;
        }
    });

    //Functions
    function validateEmail(){
        var a = $("#email").val();
        var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/;
        if(filter.test(a)){
            $("#email").removeClass("error");
            return true;
        }
        else{
            $("#email").addClass("error");
        开发者_高级运维    return false;
        }
    }
    function validateName(){
        if(name.val().length < 4){
            name.addClass("error");
            return false;
        }
        else{
            name.removeClass("error");
            return true;
        }
    }
    function validateMessage(){
        if(message.val().length < 4){
            message.addClass("error");
            return false;
        }
        else{
            message.removeClass("error");
            return true;
        }
    }

    //Some interaction with inputs & textarea
    //name
    name.focus(function(){
        if($(this).attr("value") == nameText) $(this).attr("value", "");
    });
    name.blur(function(){
        if($(this).attr("value") == "") $(this).attr("value", nameText);
    });
    //email
    email.focus(function(){
        if($(this).attr("value") == emailText) $(this).attr("value", "");
    });
    email.blur(function(){
        if($(this).attr("value") == "") $(this).attr("value", emailText);
    });
    //message
    message.focus(function(){
        if($(this).attr("value") == messageText) $(this).attr("value", "");
    });
    message.blur(function(){
        if($(this).attr("value") == "") $(this).attr("value", messageText);
    });
});

---

ohh boy!

why are you having so much trouble with javascript? Javascript is made to be fun! when you are not having fun, something you're doing is WRONG!

try this:

<form id="formContact" name="formContact" method="post" action="#">
    <input id="name" class="required" type="text" value="Your name goes here..." />
    <input id="email" class="required email" type="text" value="E-mail to reply..." />
    <textarea id="message" class="required" rows="" cols="">Your message goes here...</textarea>
    <input type="submit" value="Send" class="send" />
</form>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8/jquery.validate.min.js"></script>

Note: check the class attributes and I also added jQuery Validation plugin

if you want to use your own error messages, use:

$("form").validate({
   messages: {
     required: "We need your email address to contact you",
     email: "Your email address must be in the format of name@domain.com"
   }
});

if you want to validate the form manually, just call valid()

if(  $("form").valid() ) ...

Added

to post this into your page, just do:

$("form").bind("submit", function () {

   // let's add a loading spinner
   $(".send").addClass("loading");

   // let's send it
    $.ajax({
      type: "POST",
      url: "myReceiveMessagePage.php",
      data: $("form").serialize(),
      success: function() {
          // everything went smooth...
          $(".send").addClass("done");
      },
      error: function() { 
          // dang!
          alert("something went wrong...");
      },
      complete: function() { 
          // let's remove the fancy loading spinner
          $(".send").removeClass("loading");
      }
    });

});

this will post all values to myReceiveMessagePage.php and you can get all values in that page as a POST.

In this file you use a email object to send the email. You can't send emails using javascript only, you always need a server language for this like PHP, ASP.NET, perl, etc. Plenty of examples for sending emails out there in the web.

---

The browser can't just "send an email", you need to either submit to a server-side script that will send the email or alternatively you can ask the browser to open the user's email program with the To, Subject, and Body set using a mailto: link.

This example shows how to use a mailto: link with the subject and body.