MVC 3使用修改的查询字符串值重新加载当前页面

时间:2011-10-06 18:34:05

标签: asp.net-mvc-3 querystringparameter

背景:

我有一个MVC布局(主)视图,它使用@ Html.RenderAction在左侧导航面板中显示下拉列表。此下拉列表将显示在网站的所有页面上。 下拉列表包含在表单元素中,并且在下拉列表更改时,表单将被发布。

问题:

现在,一旦表单发布,我需要使用查询字符串中附加的下拉列表的值重新加载当前页面的内容(用户当前所在的页面...)。这意味着要替换先前选择中查询字符串中可能存在的值。

示例:

  1. 用户导航到网站的主页:
  2. 网址:/ Home /?dropdownvalue = blue

    此时下拉列表显示“蓝​​色”选中。用户将下拉列表中的值更改为“红色”。我需要使用以下网址重新加载页面 -

    /主页/?dropdownvalue =红色

    1. 用户移动到网站中的另一个页面:
    2. 网址:/ CustomerFavorite /?dropdown = red

      将下拉菜单中的值从“红色”更改为“绿色”。

      'CustomerFavourite'页面应该在querystring中重新加载'Green'。

      我为这篇文章道歉。但是,考虑提供一些额外的信息来澄清问题。

      感谢。

3 个答案:

答案 0 :(得分:7)

感谢Darin为查询字符串提供javascript操作的链接。但是,我想要一个服务器端解决方案,所以这就是我实现它的方式 -

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

}

答案 1 :(得分:3)

您可以尝试使用包含下拉列表的表单的GET方法:

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

或者整个表单可能包含在操作中:

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

然后在javascript中订阅下拉列表的更改事件并触发表单提交:

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

由于您已使用GET请求,因此会自动重新加载当前页面,并在查询字符串中发送下拉列表的值。

答案 2 :(得分:0)

如果您使用的是jQuery,则可以创建一个将所选值发布到列表中的函数。

$(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 () {

    }
  }