ASP.NET MVC3 - DropDownList Refreshes Model using jQuery

I have a drop down list that, when changed, should refresh the model for the view. Here is the controller:

    public ActionResult Index()
    {
       //do something totally awesome
    }

    [HttpPost]
    public ActionResult Index(int user)
    {
        //do something even more awesome with the new value selected from the drop down list 
    }

The relevant 开发者_运维知识库part of the View:

<div id="selectuser" class="user-input">@Html.DropDownListFor(x => x.SelectedUser, Model.Users)</div>

and the jQuery to handle the drop down list changing:

$(function () {
    $('#selectuser select').change(function () {
        $.post('@Url.Action("Index", "Home")', { user: $(this).val() }, function (result) {

        });
    });
});

It appears that everything is working, except the jQuery part. Evidently, the UrlAction(...) isn't right. When a user changes the selection, this is the URL MVC tries to load: http://localhost:5555/@Url.Action%28%22Index%22,%20%22Home%22%29

I was expecting MVC to route to the HttpPost Index action in the controller when a selection changed. Why didn't it? How do I fix it?

I'm a total noob at this - your help is greatly appreciated.

What's happening here is that the Razor engine isn't evaluating @Url.Action(). If I had to guess, I'd say that whatever is generating the JavaScript code isn't in the same razor view. If you haven't already, I'd start by moving the code into a block on the view page, if you haven't already. It's not clear from the original post whether the JQuery code is in the view or not.

Have you tried using ajax to call back to the function?

$('#selectuser select').change(function () {
   $.ajax({
       url: '@Url.Content("~/Home/Index")',
       type: "POST",
       data: val,
       datatype: "json",
       success: function (data, status, request) {
           // success code here
       },
       error: function (request, status, error) {
           // error code here
       }
    });
}

Here would be an example of a controller function (Index) that returns JSON:

[HttpPost]
public JsonResult Index(int val)
{
    try
    {
        // do what you need to here

        return Json(new
        {
             // Returning a partial view and success
             Html = this.RenderPartialView("_PartialView", model),
             Success = true
        });
    }
    catch (Exception ex)
    { 
        return Json(new
        {
             // Returning a partial view and and error
             Html = this.RenderPartialView("_PartialView", model),
             Success = false
        }, JsonRequestBehavior.AllowGet);
    }
}

I added some more examples below incase you must use an ActionResult and can't use a JsonResult.

http://blogs.us.sogeti.com/swilliams/2009/05/11/different-action-results-with-asp-net-mvc-and-jquery/

http://iridescence.no/post/Invoking-ASPNET-MVC-Actions-from-JavaScript-using-jQuery.aspx

Return ActionResult to a Dialog. ASP.NET MVC