I am loading partialview from fancybox. partialview has Form=Post, once I submit form and I need to show results on same fancybox <div>.

But return result loading full view and I am loosing control on fancybox after submit.

view load fancybox

index.cshtml

@using System.Web.UI.WebControls @model SPE.ContactSubmissionForm.Models.Contact <div id="result"></div> @using (Html.BeginForm(null, null, FormMethod.Post, new { enctype = "multipart/form-data", @class = "form-horizontal", role = "form" })) { //html controls <div class="form-group"> <div class="col-sm-4 col-md-offset-5"> <button type="submit" class="btn btn-primary">Submit</button> <button type="submit" class="btn btn-default">Cancel</button> </div> </div> }

javascript

$(function (e) { e.preventDefault(); $('form').submit(function () { if ($(this).valid()) { $.ajax({ url: this.action, contentType: attr("enctype", "multipart/form-data"), type: this.method, data: $(this).serialize(), success: function (result) { $('#result').html(result); } }); } return false; });

ContactSubmissionController .cs

 [HttpPost] public ActionResult Index(Contact contact) { if (ModelState.IsValid) { if (contact != null) { // byte[] data = convertBytes(contact.Attachement); string attachment = SaveFile(contact.Attachement); personifyContext.SaveContactSubmissionData(contact.FirstName, contact.LastName, contact.EmailAddress, contact.Issue, contact.Description, contact.CountryCode, contact.SPECustomerNumber, contact.CustomerServiceAgent, contact.ContactPhoneNumber, new byte[] {}); } } contact.Countries = personifyContext.GetCountries(); return PartialView(contact); //return Content("Thanks", "text/html"); }

How to stay in the same fancybox after I post back?