Question

我有一个下拉列表，用户在下拉列表中选择一个选项，并根据该值获得一个填充的仪表板。我的问题是当用户单击浏览器中的后退按钮时，如何保留下拉列表值以及仪表板值。我尝试了OutputCache，但输出缓存只是缓存渲染的HTML而不是数据，我尝试了内存缓存，但这也没有用。

型号：

public class InternalViewModel
{
      public int totalclients { get; set; }
      public int clientid { get; set; }
      public DateTime? AsOFdate { get; set; }
}

控制器：

  public ActionResult Dropdownlist()
        {
            InternalViewModel app = new InternalViewModel();          
            app.totalclients = db2.AppClients.Count();          
            IEnumerable<SelectListItem> clients = db2.AppClients.Select(c => new SelectListItem
            {
                Value = c.ClientID.ToString(),
                Text = c.ClientName
            });
            ViewBag.clients = clients;       
            return PartialView(app);

        }

查看：

_dropdownlist.cshtml
             <div>
              @(Html.Kendo().DropDownListFor(model => model.clientid)
              .Name("clientid")
              .DataTextField("Text")
              .DataValueField("Value")
              .Filter("contains")
              .OptionLabel("--Select --")
              .BindTo((System.Collections.IEnumerable)ViewBag.clients)
              .HtmlAttributes(new { @id = "dropdown2", @class = "form-control" })
                    )
                </div>


  $('#dropdown2').change(function () {         
            var selectedID = $(this).val();
$('#RecDashboard').load("/InternalRec/Index", { clientid: selectedID }, function () {               
                $("#recstatus").load("/AppRec/Index", { clientid: selectedID })
            })

根据下拉列表值 - 调用internalrec控制器和app rec控制器。 InternalRec控制器用于显示仪表板.AndRec显示另一种仪表板。两个仪表板都由下拉列表选项驱动。

InternaRec返回一个包含仪表板的视图，为了简洁起见，我不包括所有这些内容。

但它是这样的

public ActionResult InternalRec(int? clientid)
{
//some stuff is done

//values to be displayed on dashboard are computed, all these values need clientid.

return PartialView();
}

因此，当用户点击浏览器上的后退按钮并返回此页面时。我希望用户能够看到所选的下拉列表值以及仪表板值，基本上不应该刷新页面。我怎样才能做到这一点？

由于

Answer 1

你必须以某种方式坚持这种选择。这有两个选择：

使用AJAX在下拉选择更改时设置会话变量（服务器端）。渲染下拉列表时，应检查此会话变量，如果存在，请将下拉列表设置为它具有的值。
使用localStorage。这是一种纯粹的客户端方法。基本上，您只需在更改下拉列表时在localStorage中设置一个键。在页面加载时，从localStorage读取该键并相应地设置下拉列表。

第一种方法将是您更安全，更跨浏览的选项，但即使在某些旧版本的IE中，localStorage也确实提供了相当不错的支持，所以它没有那么多的交易像往常一样破碎。

<强>更新

要设置它，首先需要一个动作服务器端来响应AJAX请求。最简单的是，它看起来像是：

[HttpPost]
public ActionResult SetClientId(int clientId)
{
    Session["ClientId"] = clientId;
    return Json(new { success = true })
}

然后，你是AJAX，客户端：

$('#clientid').on('change', function () {
    $.post('/url/to/action/above/', { clientId: $(this).val() });
    // omitted success function as there's nothing you really need to do,
    // just fire and forget
});

如果您处于允许编辑clientid的操作中，则只需尝试从Session进行设置：

model.clientid = Session["ClientId"] as int? ?? default(int);

看起来有点奇怪，但它主要是因为你有一个不可空的int属性。首先，会话值存储为字符串，因此您需要将值转换为 nullable int（as int?）。由于我们正在使用as，如果该值无法转换为int，则将其设置为null，因此我们必须强制转换为可空。但是，您仍然无法存储此属性的可空int，因此null-coalesce运算符（??）用于将值设置为default(int) if相反，它是null。

在asp.net mvc中单击浏览器后退按钮时保留下拉列表的选定值

1 个答案: