MVC 3 Refresh current page with modified query values

Question

Background:

I have an MVC layout (master) view that uses @ Html.RenderAction to display a dropdown in the left side navigation bar. This drop-down list will be displayed on all pages of the site. The drop-down menu is wrapped in a form element and when the drop-down list is changed, the form is published.

Question:

Now, as soon as the form is published, I need to reload the contents of the current page (on any page on which the user is currently enabled ...) with the value of the drop-down list attached to the query string. This would mean replacing the value that may already be in the query from the previous selection.

Example:

• The user goes to the website’s homepage:

URL: / Home /? dropdownvalue = blue

At this point, "Blue" is displayed in the drop-down list. The user changes the value in the drop-down list to "Red." I need to reload the page with the following url -

/ Home /? Dropdownvalue = Red

• The user goes to another page on the site:

URL: / CustomerFavorite /? dropdown = red

Change the value in the drop-down list from "Red" to "Green."

The CustomerFavourite page must be reloaded with a Green in the request.

Sorry for the long post. But I thought about providing more information to clarify the problem.

Thanks.

Answer 1

Thanks to Darin for providing a link to javascript manipulation of the request. But I wanted the server solution to be the way I implemented it -

public ActionResult _ColorSelection(ColorModel model) { string selectedColor = model.Color.Value; // Modify Querystring params... NameValueCollection querystring = HttpUtility.ParseQueryString(Request.UrlReferrer.Query); // Parse QS // If Querystring contains the 'color' param, then set it to selected value if (!string.IsNullOrEmpty(querystring["color"])) { querystring["color"] = selectedColor; } else // Add color key to querystring { querystring.Add("color", selectedColor); } // Create new url string url = Request.UrlReferrer.AbsolutePath + "?" + querystring.ToString(); return Redirect(url); // redirect } 

Answer 2

You can try using the GET method of the form in which the patch is packaged:

 @using (Html.BeginForm(null, null, FormMethod.Get)) { @Html.Action("SomeActionThatRendersTheDropDown", "SomeController") } 

or perhaps the whole form is completed within the action:

 @Html.Action("SomeAction", "SomeController") 

and then in javascript subscribe to the dropdown list change event and initiate the form submission:

 $(function() { $('#DropDownId').change(function() { $(this).closest('form').submit(); }); }); 

Since you used a GET request, this will automatically reload the current page by sending the dropdown value in the query string.

Answer 3

If you use jQuery, you can create a function that displays the selected value in your list.

 $(document).ready(function () { $("#ListId").change(function () { $.ajax({ url: "CustomerFavorite/Edit", type: "POST", data: "colour=" + $("#ListId").val(), success: function (result) { //Code to update your page } }, error: function () { } }