Here’s an example, taken from feedback (contact us) form:

Lets start coding. First of all, we need to have a link. When we click it, it will create boxy window.
<a href="#" class="contact_us">Contact us</a>

Short javascript which do everything: handle contact us link click, creates boxy window, handle form submit, post form using ajax and set the respond to boxy content.

$(function() {
    /* set global variable for boxy window */
    var contactBoxy = null;
    /* what to do when click on contact us link */
    $('.contact_us').click(function(){
        var boxy_content;
        boxy_content += "<div style=\"width:300px; height:300px\"><form id=\"feedback\">";
        boxy_content += "<p>Subject<br /><input type=\"text\" name=\"subject\" id=\"subject\" size=\"41\" /></p><p>Your name and/or email:<br /><input type=\"text\" name=\"your_email\" size=\"41\" /></p><p>Comment:<br /><textarea name=\"comment\" id=\"comment\" cols=\"39\" rows=\"5\"></textarea></p><br /><input type=\"submit\" name=\"submit\" value=\"Send >>\" />";
        boxy_content += "</form></div>";
        contactBoxy = new Boxy(boxy_content, {
            title: "Send feedback",
            draggable: false,
            modal: true,
            behaviours: function(c) {
                c.find('#feedback').submit(function() {
                    Boxy.get(this).setContent("<div style=\"width: 300px; height: 300px\">Sending...</div>");
                    // submit form by ajax using post and send 3 values: subject, your_email, comment
                    $.post("feedback.php", { subject: c.find("input[name='subject']").val(), your_email: c.find("input[name='your_email']").val(), comment: c.find("#comment").val()},
                    function(data){
                        /*set boxy content to data from ajax call back*/
                        contactBoxy.setContent("<div style=\"width: 300px; height: 300px\">"+data+"</div>");
                    });
                    return false;
                });
            }
        });
        return false;
    });
});

So thats all. I believe you will be able to create feedback.php your self. And here is the live demo of this feedback (a.k.a contact us) form

function refreshContent() {
  $("#content").fadeOut("slow", function(){
    $("#content").load("getrandomcontent.php",false, function() {
      $("#content").fadeIn("slow");
    });
  })
  return false;
}

Now you can use this function for a link
<a href="#" onclick="return refreshContent();">Refresh</a>
When you click it, the content in div element with an id “content” will be changed. getrandomcontent.php is used to get random content.

Check our demo.

If this post helped you to solve your problem, please donate me. Donation button can be found on the right side of the page.