Displaying a Modal dialog box after successful form submission - model-view-controller

Question

I for the life of me cant figure out how to display a modal pop up dialog box after the form has been submitted. The dialog box should only appear after i receive a ViewBag value from the controller and then we can take it from there but i just can`t get the modal box to pop up and the page just navigates to my redirected page. I am also using Umbraco Surface controller instead of the usual MVC controller class.
I have tried to use ViewBags and data-toggle with data-target to modal but to no avail. Still can`t get modal to pop up.
View
<input type="submit" id="submit" name="submit" class="submit btn btn-success" value="Submit" data-toggle="modal" data-target="#MyModal" />
Modal
#if (ViewBag.Status != null)
{
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Successfully Registered</h4>
</div>
<div class="modal-body">
Congratulations!!! you have been registered to our website. You will recieve an email for confirmation.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" onclick="location.href='/';">Ok</button>
</div>
</div>
</div>
</div>
}
Controller
public ActionResult SubmitForm(RegistrationModel model)
{
var errors = ModelState.Values.SelectMany(v => v.Errors);
if (ModelState.IsValid) {
// Get the details and save it to model
RegisterUser(model);
TempData["ContactSuccess"] = true;
//SendEmail(model);
// TempData["Success"] = true;
ViewBag.Status = "Success";
return RedirectToUmbracoPage(1144);
// return RedirectToCurrentUmbracoPage();
}
return RedirectToUmbracoPage(1146);
//return RedirectToCurrentUmbracoPage();
}
My Expected result would just be to show the modal pop up and stop the redirection. I know i would need to change the returntoumbracopage return but i just need some help on this.

Answer 1

Without modifying your controller logic I would set the success state in a session. See https://learn.microsoft.com/en-us/dotnet/api/system.web.httpcontext.session?view=netframework-4.8
Alternatively, it would be a better approach to post the data using Ajax and returning a JSON model representing the state of the form submission and updating the page accordingly.