如何在页面请求之间保留Telerik TabStrip选项卡？

in Telerik ASP.NET MVC TabStrip, I want the page to remember which tab was selected last and persist the selection through multiple page requests. What I have is a partial view that shows in multiple pages and it contains the TabStrip. With SelectedIndex the set tab always get selected, which nullifies user's selection.

在Telerik ASP.NET MVC TabStrip中，我希望页面记住最后选择了哪个选项卡，并通过多个页面请求保留选择。我所拥有的是一个部分视图，显示在多个页面中，它包含TabStrip。使用SelectedIndex，设置选项卡始终被选中，这将使用户的选择无效。

1 个解决方案

#1

I couldn't find any official way of doing this through the Telerik APIs, nor any useful advice on their forum, so I decided to go it my own way with the use of:

我无法通过Telerik API找到任何官方方式，也没有在他们的论坛上找到任何有用的建议，所以我决定采用以下方式自行解决：

Html.Telerik().TabStrip().ClientEvents() both the OnSelect() and OnLoad()
Html.Telerik（）。TabStrip（）。ClientEvents（）OnSelect（）和OnLoad（）
The cookie plugin for jQuery
jQuery的cookie插件

Then I wired them up as below, in the partial view that contains the TabStrip.

然后我在包含TabStrip的局部视图中将它们连接起来，如下所示。

.ClientEvents(events => events
.OnSelect(() =>
{ 
    %>
    function(e) {
        var item = $(e.item);
        $.cookie('selectedTabIndex', item.index(), { path: '/' });
    }
    <%
})
.OnLoad(() =>
{ 
    %>
    function(e) {
        var tabStrip = $("#TabStrip").data("tTabStrip");
        var index = $.cookie('selectedTabIndex');
        var domElement = $("li", tabStrip.element)[index];
        tabStrip.select(domElement);
    }
    <%
})

)

）

Edit: I realised that my answer was little bit lacking in explanation so I've added:

编辑：我意识到我的答案有点缺乏解释，所以我补充说：

In case it's not obvious, the OnSelect is capturing the index of the selected tab when it is selected and writing that to a cookie called selectedTabIndex. The path is being set so it will cover our whole site, but if you leave that out it will create a new cookie for each different path (which may be your desired behaviour). Someone more familiar with the jQuery cookie plugin please correct me if I'm wrong there, I haven't used it much.

如果不明显，OnSelect会在选中选项卡时捕获所选选项卡的索引，并将其写入名为selectedTabIndex的cookie。路径正在设置，因此它将覆盖我们的整个站点，但是如果你将其遗漏，它将为每个不同的路径创建一个新的cookie（这可能是你想要的行为）。有人更熟悉jQuery cookie插件请纠正我，如果我错在那里，我没有太多使用它。

Then in the OnLoad it's doing the opposite, basically. It finds the tabStrip, gets the index from the cookie, then gets the domElement of the tab at the index from the cookie and tells the tabStrip to select that domElement.

然后在OnLoad中它基本上正好相反。它找到tabStrip，从cookie中获取索引，然后从cookie获取索引处的选项卡的domElement，并告诉tabStrip选择该domElement。

This seems to work pretty well in Chrome and IE, but there may be some quirks in FFox 3.

这似乎在Chrome和IE中运行良好，但在FFox 3中可能存在一些怪癖。

I hope the Telerik team considers adding this to their API, as it strikes me as being a pretty useful feature to have baked-in. Apologies if it already is, but I couldn't find it in the docs.

我希望Telerik团队考虑将其添加到他们的API中，因为它让我觉得它是一个非常有用的功能。抱歉，如果它已经存在，但我在文档中找不到它。

#1