Why not use the correct URLs as values of the SelectListItem
and use this value to redirect/load the content?
In your ViewModel for the GET use case:
var urlHelper = new UrlHelper(HttpContext.Current.Request.RequestContext);
var availableOptions = new List<SelectListItem> {
new SelectListItem {
Text = "All",
Value = urlHelper.Action("GetAll", "Notifications"),
Selected = true
},
new SelectListItem {
Text = "Read/Unread",
Value = urlHelper.Action("GetReadOrUnread", "Notifications"),
Selected = false
},
new SelectListItem {
Text = "Categories",
Value = urlHelper.Action("GetCategories", "Notifications"),
Selected = false
}
};
In your razor view:
@Html.DropDownListFor(m => m.SelectedView, Model.AvailableOptions)
<script>
$(document).ready(function() {
// use @Html.IdFor so this does not break
// if you rename the SelectedView property in the ViewModel
var dropdown = $('#@Html.IdFor(m => m.SelectedView)');
dropdown.on('change', function () {
// this gets the "value" attribute of the selected option
var selectedUrl = $('option:selected', dropdown).val();
$.ajax({
url: selectedUrl,
success: function(result){ /* insert retrieved HTML into DOM ... */ }
});
});
});
</script>