How to fire off an ActionLink (controller method) defined in a view.

Question

I have an ASP.NET MVC app with a view that has Form, some buttons and modal popups.

 

My code for the save button works fine. I am not including that code below.

 

My problem is the cancel button.

 

When that button is clicked, I prevent the default behavior from happening so I can present a modal.

 

From the 'yes' selection of the cancel button modal, I now want to fire off that default behavior which is the controller action method defined in the actionlink for that button. When clicked, the method gets the data again and returns the entire same view in it's original state before changes were made - hence cancelling the changes.

 

I don't think I can use an AJAX call in the yes modal to call that action method as that method re retrieves the data and sends back the entire view.

 

In the "success:" of the AJAX call, I would have to remove the entire current view and then replace it with the view sent back. But how can I remove the current view as I would be removing the jQuery code I am executing as it is part of the view?

 

So how can I call that action method that returns the entire view and re-render the view returned?

 

The view (simplified):

@model GbngWebClient.Models.UserProfileForMaintVM

@using (Html.BeginForm("ProcessSaveUserProfile", "UserProfile", FormMethod.Post, new { enctype =
"multipart/form-data", id = "formId" }))
{
    <div class="panel-body">
        <div class="row">
            <div class="form-group">
                <div class="col-md-3">
                    <input type="submit" value="Save" class="btn btn-primary saveButton" />
                </div>
                <div class="col-md-3">
                    @Html.ActionLink("Cancel Changes", "GetUserProfile", "UserProfile", null, new {
@class = "btn btn-info cancelButton" })
                </div>
            </div>
        </div>
    </div>
}

<div class="modal fade" id="myModal13" role="dialog" display="none">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-body" style="padding:10px;">
                <h4 class="text-center">Any unsaved changes will not be processed if you cancel.
Continue ?</h4>
                <div class="text-center">
                    <a class="btn btn-info btn-yes13">Yes</a>
                    <a class="btn btn-default btn-no13">No</a>
                </div>
            </div>
        </div>
    </div>
</div>

@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@Styles.Render("~/Content/css")

<script type="text/javascript">
    $(document).ready(function () {
        $(".cancelButton").click(function (e) {
            // Trigger(show) the modal.
            $("#myModal13").modal({
                backdrop: 'static',
                keyboard: false
            });

            // Prevent the ActionLink from going to the controller.
            e.preventDefault();
        });

        $('.btn-yes13').click(function() {
            // Hide the modal.
            $('#myModal13').modal('hide');

            // CONCERN: HOW TO NOW FIRE THE ActionLink TO GO TO THE CONTROLLER METHOD?

            // Return.
            return true;
        });

        $(".btn-no13").click(function () {
            $("#myModal13").modal("hide");

            return false;
        });

        // Remove the modal once it is closed.
        $("#myModal13").on('hidden.bs.modal', function () {
            $("#myModal13").remove();
        });
    });
</script>