How to use AJAX Post to invoke ASP.NET MVC Controller action and return new View?

Question

I am working a site in ASP.NET MVC where the user is presented with a calendar, and clicking on a particular calendar date invokes the following function:

function selectHandler(event, data) {
            var myRequest = new Request.HTML({
                url: '/Calendar/EventList',
                method: 'post',
                data: { datedata: data.toString() },
                update: $('postback'),
            }).send();
        };

I am using the MooTools AJAX classes to invoke my Controller Action /Calendar/EventList, shown below:

    [AcceptVerbs(HttpVerbs.Post)]
    public ActionResult EventList(string datedata)
    {

                CalendarViewData viewData = new CalendarViewData 
                { EventList = GetEventsList(datedata) };

                return View(viewData);
    }

I can set a breakpoint in the EventList action, and see that it is returning the view, but the browser remains on the initial page, and never redirects to the page returned by this EventList action.

I suspect I need to add more to my JavaScript function but am not sure what. Any ideas?

Answer 1

Why would the browser redirect? You are sending an AJAX request to a controller action which returns a view (this probably is wrong, you might need to return a partial view) which is then used to update some element in the DOM. If you want to redirect you could use a simple anchor tag (or a form if you need to POST), no need to use javascript.