$(function() {



    $("#contact-form").validate({
        submitHandler: function(form) {
            $('#contact-content').hide();
            fname=$("input#form_first_name").val();
            name=$("input#form_name").val();
            email=$("input#form_email").val();
            message=$("#form_message").val();
           var dataString = 'form_first_name='+ fname + '&form_name='+ name + '&form_email=' + email + '&form_message=' + message;
            $.ajax({
                type: "POST",
                url: "contact.php",
                data:dataString,

                success: function() {
                   
                    $("#message").show();
                    $("#contact-form").clearForm();
                    $("#message").delay(1500).fadeOut(function(){},function(){ $("#message").hide();$('#contact-content').fadeIn()});
                }
            });
        },
        rules: {
            form_name:{
                required:true,
                minlength:2
            },

            form_email: {
                required: true,
                email: true

            }
        },
        messages: {

            lastname: "Please enter your lastname",
            form_name: {
                required: "Please enter a name",
                minlength: "Minimum 2 characters"
            },
            password: {
                required: "Please provide a password",
                minlength: "Your password must be at least 5 characters long"
            },
            confirm_password: {
                required: "Please provide a password",
                minlength: "Your password must be at least 5 characters long",
                equalTo: "Please enter the same password as above"
            },
            form_email: "Valid email required",
            agree: "Please accept our policy"
        }

    });


    $('#send-button').click(function(e){

        e.preventDefault();
        $('#contact-form').submit();
        
       
    });


});

$.fn.clearForm = function() {

    // iterate each matching form

    return this.each(function() {

        // iterate the elements within the form

        $(':input', this).each(function() {

            var type = this.type, tag = this.tagName.toLowerCase();

            if (type == 'text' || type == 'password' || tag == 'textarea')

                this.value = '';

            else if (type == 'checkbox' || type == 'radio')

                this.checked = false;

            else if (tag == 'select')

                this.selectedIndex = -1;

        });

    });
}