How do I save user input content in the view and do a post call to the controller when navigate away from page, silently

Question

So the title says what I want to accomplish. Here's what I'm working with:

Microsoft MVC4 Razor views

Model
class Model1
{
    public string var1 {get; set;}
    public bool ExitPage {get; set;}
}

the view is cshtml, and looks something like this:

@using Models
@model Model1

@using (Html.BeginForm())
{
    bool notFromSubmit = false;

    @Html.HiddenFor(x => x.ExitPage)
    @Html.Hidden("ExitPage", Model.ExitPage)

    Model.ExitPage = false;

    <article class="widget widgetFullPage" data-role="collapsible" data-collapsed="true">
        <h2 id="contactDetails">GENERAL INFORMATION</h2>
        <table>
            <tr id="Row1" style="background-color: #FFFFFF;">
                <td style="width: 200px; padding-bottom: 10px; padding-left: 30px; padding-top: 20px"><label>Var1</label></td>
                <td id="var1Id" style="padding-bottom: 10px; padding-top: 20px; width: 300px">
                    @Html.TextBoxFor(x => x.var1, null, new { style = "width:100px;" })
                </td>
                <td style="width: 250px; padding-top: 20px;"></td>
            </tr>

            <tr id="Row2">
                <td></td>
                <td></td>
                <td style="float: right; vertical-align: top; padding-right: 30px; padding-bottom: 20px">
                    <input value=" " class="nextbutton loading" type="submit" id="NextButton" />
                </td>
            </tr>
        </table>
    </article>

}

<script type="text/javascript">

    $("#NextButton").on('click', function () {
        if (window.notFromSubmit) {
            document.getElementById('ExitPage').value = true;
        } else {
            document.getElementById('ExitPage').value = false;
        }
    });

    $(document).ready(function() {
        window.onbeforeunload = function () {
           if (window.event) {
               window.notFromSubmit = true;
               $("#CaseManagementNextButton").click();
           }
           return null;
        };
    });

</script>

What I'm trying to accomplish here is when the next button is hit, it does the post back with the save, and the controller will redirect the user to the next page. Where as when the user navigates away/close the page, it will set the ExitPage variable on the model so the controller will just do the save and exit.

This mostly works, only that I have to do this silently (no popup dialog). however, using the "onbeforeunload" event. Even when returning null, it's still poping up a confirmation box and want to make the user choose to stay or to leave. Is there a way to not have the dialog box pop up and just do the leave action and still trigger the click event on the next button? When I comment out the return, it does not popup the dialog box, but it also does not execute the nextbutton click event.

Any help would be appreciate it.

Answer 1

添加onblur =“ myFunction（），然后异步调用控制器。