I have been looking around online on how to get a web form to work inside of FancyBox. The form displays correctly, but when I press submit, it submits and adds a row to the database, but everything is blank (meaning its not really adding the data). In addition to this, it does not show a response to say if the message has been sent in the lightbox or not. I reviewed other questions similar to this and found out that AJAX is used to submit it. Ive never really used AJAX before so I am not for sure what is wrong. I have also used FireBug and it does not show any data transmitting.
Code for Form:
<div style="display: none">
<div id="contact">
This form will allow you to contact our staff support team. This can be used to request ban reversals, login problems, etc. Just note, all responses will be sent via e-mail.<br />Be sure you leave us a valid e-mail and to be sure you check this email often and to check your spam folders if you do not receive a response.<br /><br /><center>
<form action="" method="post" id="contactus">
Your Name: <input type="text" STYLE="color: black; background-color: white;" name="name" value="" /><br />
Your Email: <input type="text" STYLE="color: black; background-color: white;" name="email" value="" /><br /><br />
Your Message: <br /><br /><textarea rows="10" cols="70" STYLE="color: black; background-color: white;" name="textarea" value=""></textarea><br /><br />
<input type="submit" STYLE="color: black; background-color: white;" value="Submit Message" /> </form><br /></center>
</div>
</div>
Here is the AJAX Function
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox();
});
</script>
$("#contact").bind("submit", function() {
$.fancybox.showActivity();
$.ajax({
type : "POST",
cache : false,
url : "outsidesupport_processed.php",
data : $(this).serializeArray(),
success :function(data){
$.fancybox(data);
}
});
return false;
});
});
</script>