Question

I have a tooltip with a simple contact form that I want to load the “message sent” int to the same tooltip div instead of loading a external submit.php page.

<div id="contactform" >        
            <form method="post" action="submit.php">
            <label for="Name">name</label><br />
            <input type="text" name="Name" id="name" /><br />

            <label for="Email">email</label><br />
            <input type="text" name="Email" id="email" /><br />

            <input type="submit" name="submit" value="send" class="submit" id="submit"/>
            </form>
    </div>

Answer 1

Add this to your header:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

jQuery

$(document).ready(function()
{
    $('#contactform form').submit(function()
    {
        var dataString=$(this).serialize();

        $.post('/ajax/submit.php', dataString, function(txt)
        {
            $('#contactform').html(txt);
        });

        return false;
    });
});

jQuery.post()

PHP (/ajax/submit.php)

<?php

if($_POST['submit'] == 'send')
{
    /* your PHP code */

    echo 'Your message was sent.';
}

?>