Ajax.BeginForm that can redirect to a new page

Question

I have an @Ajax.BeginForm for my model which has a boolean value (@Html.CheckBoxFor). If this is checked, I want my HttpPost action to redirect to a new page. Otherwise I want it to just continue being an @Ajax.BeginForm and update part of the page.

Here is my HttpPost action (Note: Checkout is the boolean value in my model)

Controller:

    [HttpPost]
    public ActionResult UpdateModel(BasketModel model)
    {
        if (model.Checkout)
        {
            // I want it to redirect to a new page
            return RedirectToAction("Checkout");
        }
        else
        {
            return PartialView("_Updated");
        }
    }

score 47 · Accepted Answer · edited Aug 01 '12 at 22:58

47

You could use JSON and perform the redirect on the client:

[HttpPost]
public ActionResult UpdateModel(BasketModel model)
{
    if (model.Checkout)
    {
        // return to the client the url to redirect to
        return Json(new { url = Url.Action("Checkout") });
    }
    else
    {
        return PartialView("_Updated");
    }
}

and then:

@using (Ajax.BeginForm("UpdateModel", "MyController", new AjaxOptions { OnSuccess = "onSuccess", UpdateTargetId = "foo" }))
{
    ...
}

and finally:

var onSuccess = function(result) {
    if (result.url) {
        // if the server returned a JSON object containing an url 
        // property we redirect the browser to that url
        window.location.href = result.url;
    }
}

edited Aug 01 '12 at 22:58

Peter

2,654
2
33
44

answered Feb 22 '12 at 08:18

Darin Dimitrov

1,023,142
271
3,287
2,928

@Darin Dimitrov I want to redirect to an action that requires an id parameter to be passed to it. How would I pass that from my Ajax.BeginForm view? – Joe Sep 13 '12 at 15:56
I can't get the var onSucess to work. I loaded these jquery scripts in the view. jquery.unobtrusive-ajax.min.js jquery-ui-1.8.20.min.js jquery-ui-1.8.22.custom.min.js jquery.validate.min.js jquery.validate.unobtrusive.min.js Here's the code in the view @{var onSuccess = function(result) { if (result.url) { window.location.href = result.url; } } int acntid = Model.AcntId; }
Add

@using (Ajax.BeginForm("ShipAdd", new AjaxOptions() { OnSuccess = "onSuccess(acntid)", UpdateTargetId = "ShipAdd", HttpMethod = "Post" })) Continued.
– Joe Sep 13 '12 at 16:54
Continued. Intellisense says function, result and window are not in context. Also would this be the proper way to pass a parameter? Thanks – Joe Sep 13 '12 at 16:54
The var onSucess needs to be in a – Joe Sep 13 '12 at 17:08
I posted a new question concerning how to pass a route value http://stackoverflow.com/questions/12417668/ajax-beginform-that-can-redirect-to-a-new-page-and-pass-a-parameter – Joe Sep 14 '12 at 03:20
here is **one liner** `return JavaScript( "window.location = '" + Url.Action("Checkout","Home") + "'" )` check [this](http://stackoverflow.com/questions/1538523/how-to-get-an-asp-net-mvc-ajax-response-to-redirect-to-new-page-instead-of-inser), hope helps someone. – Shaiju T Jun 21 '16 at 15:26

Ajax.BeginForm that can redirect to a new page

1 Answers1

Add

Linked