Fancybox is a great jquery plugin that allows you to display content; typically images, html or external websites over the top of your website.

I have used this plugin many times, but recently I used it to display a contact form on a .Net page. It worked perfectly fine in Chrome, but when it came to IE and Firefox the form was not behaving correctly. The form would try and submit even if it failed the validation. The form was also not hitting the server-side code which would process the form.

After a long time trying to figure out the issue and even trying alternative plugins I found this post. All I did was change the word ‘body’ to ‘form’ in the fancybox js file.

This is because the new elements we being created outside of the pages form which should be set to runat=’server’. Once it was set to create the elements in the pages form it all started working.