simple MVC form post and url routing question....I hope - asp.net

Question

I have a view called Associations that has a drop down list and a button. When the user selects an option and presses submit, I want them to go to Association/{associationKey}. Association needs to work on get and post.
Currently, with the code below, when the form is posted, it DOES go to Association and displays the correct record, BUT it does not append the associationKey to the url.
So I am getting:
http://localhost/Association
instead of:
http://localhost/Association/202
If I manually navigate to http://localhost/Association/202 everything works perfectly, so get and post are both working fine....I just want the key in the url after a post!
Surely there must be something super simple I am doing wrong. Relevant code below.
Thanks!
ASSOCIATIONS view:
<% Html.BeginForm("Association", "Staff", FormMethod.Post); %>
<%:Html.DropDownList("associationKey", new SelectList(Model.Associations.ToList(), "AssociationKey", "LegalName"))%>
<input type="submit" value="Edit The Selected Record" />
<% Html.EndForm(); %>
STAFF controller:
[AcceptVerbs(HttpVerbs.Get | HttpVerbs.Post)]
public ActionResult Association(int associationKey)
{
return View("Association", new AssociationViewModel(associationKey));
}
GLOBAL.asax:
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
routes.MapRoute("Default", "{action}", new { controller = "Staff", action = "Default" });
routes.MapRoute("Associations", "Associations", new { controller = "Staff", action = "Associations" });
routes.MapRoute("Association", "Association/{associationKey}", new { controller = "Staff", action = "Association" });
}
ASSOCIATION view model:
public class AssociationViewModel
{
public Repository db = new Repository();
public Association Association {get; private set; }
public List TelephoneTypes { get; private set; }
public AssociationViewModel(int associationKey)
{
Association = db.AssociationById(associationKey);
TelephoneTypes = db.ListTelephoneTypes().ToList();
}
}

Answer 1

I think you should separate out your controller actions into a Get action and a POST action like so:
[AcceptVerbs(HttpVerbs.Get)]
public ActionResult Association(int associationKey)
{
return View("Association", new AssociationViewModel(associationKey));
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Association(AssociationViewModel model)
{
return RedirectToAction("Association", new {associationKey= model.associationKey});
}
The MVC framework will automatically bind the selected value from your SelectList to the model (assuming you have a property in the model to hold the selected value). From there you just need to redirect to your GET method passing in the key.

Answer 2

It's doing a post instead of a GET. This puts the value in the form parameters not in the url. You might want to intercept the form submit using javascript and turn it into a GET using location=..
<script type="text/javascript">
$(function() { // requires jQuery
$('form').submit( function() {
// maybe do some validation to ensure a legal value chosen first?
location.href = $(this).attr('action') + '/' + $(this).find('select').value();
return false; // cancel submit
});
});
</script>
<% Html.BeginForm("Association", "Staff", FormMethod.Post); %>
<%:Html.DropDownList("associationKey", new SelectList(Model.Associations.ToList(), "AssociationKey", "LegalName"))%>
<input type="submit" value="Edit The Selected Record" />
<% Html.EndForm(); %>