Prevent updating html with some conditions in MVC Ajax.BeginForm?

Question

I have the following code in my View,
It's for searching in a site, a user can submit the following form multiple times.

@using (Ajax.BeginRouteForm("Search", new AjaxOptions
{
    InsertionMode = InsertionMode.Replace,
    UpdateTargetId = "SearchContents",
    LoadingElementId = "SearchAjaxLoader",
    OnSuccess = "SearchLoadContentsOnSuccess",
    OnFailure = "SearchLoadContentsOnFailure",
    OnBegin = "SearchLoadContentsOnBegin",
    OnComplete = "SearchLoadContentsOnComplete",
}))
{
   @Html.AntiForgeryToken()
   <input type="text" name="Search" />
   <input type="submit" value="Submit" />
}

I wanna reject old ajax results and show the latest ajax result only.
In a non mvc Ajax form, I was creating an array as ajax counter and compare the server responses with it to prevent update html.
I wanna know how I can prevent Ajax.BeginForm to update Html on some conditions.

Answer 1

As an example I will demonstrate with an OnSuccess call, you can do this for each event you wish to handle.

In your AjaxOptions remove this to prevent the replace;

InsertionMode = InsertionMode.Replace,
UpdateTargetId = "SearchContents",

In you SearchLoadContentsOnSuccess JavaScript method, without seeing the method I am guesing it will be something like this:

function SearchLoadContentsOnSuccess()
{
    // Do something
}

Change it to this:

function SearchLoadContentsOnSuccess(e)
{
    // Do something
}

Now the e parameter will contain the data that is sent back from your ajax call.

In your updated method, I would simply check the response and act acordingly. As an example if you response contains a value and results property:

function SearchLoadContentsOnSuccess(e)
{
    // Do something 
    $(e.value == 1)
        {
          $('#SearchContents').html(e.results);
        }
}

You would simply change the javascript in the above method to suite your needs.