0

我有一个中继器,它使用 Sitecore (sc:Link) 动态生成选项卡链接,如下所示:

<asp:Repeater ID="rptTab" runat="server" OnItemDataBound="rptTab_ItemBound">
            <ItemTemplate>
                <li id= "liTabTest" runat = "server" class="tab-label">
                    <asp:HyperLink onclick = "javascript: TabClick(this)" runat="server" id="aLink">
                        <sc:Link ID="hlTabLink" Field="scTabLink" runat="server" ></sc:Link>
                    </asp:HyperLink>
                </li>
            </ItemTemplate>
       </asp:Repeater>

我通过 JS 操作 CSS:

var loadURL;
$(document).ready(function () {
    init();
});

function init() {
     $("ul#Tab-labels li:first").addClass("TabbedPanelsTabSelected");
  };

  function TabClick(obj) {
      $("ul#Tab-labels li").removeClass("TabbedPanelsTabSelected");
      $(obj).addClass("TabbedPanelsTabSelected");

 };

不幸的是,这不起作用,因为每个选项卡都是一个单独的 .ASPX 页面,因此页面再次呈现,这就是为什么调用 JS 中的 Init() 并且每次都对第一项执行 CSS 的原因。

这是我背后的代码:

        protected void rptTab_ItemBound(Object sender, RepeaterItemEventArgs e)
    {
        if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
        {
            Item i = e.Item.DataItem as Item;
            Link hlTabLink = e.Item.FindControl("hlTabLink") as Link;
            hlTabLink.DataSource = i.Paths.FullPath;
            hlTabLink.Field = "Title";
            HyperLink aLink = e.Item.FindControl("aLink") as HyperLink;
            aLink.NavigateUrl = Sitecore.Links.LinkManager.GetItemUrl(i);
        }
    }

我尝试通过代码隐藏添加 CSS,但它不起作用,因为我无法获取选项卡的索引(正在选择哪个选项卡)。任何解决方案将不胜感激!谢谢!

4

2 回答 2

7

不要为在代码隐藏中更好(且更容易)完成的任务运行 javascript。只需为 Sitecore.Context.Item 与选项卡名称匹配的中继器项目设置活动类。ItemDataBound 中的伪代码:

if(i == Sitecore.Context.Item)
{
    HtmlGenericControl li = e.Item.FindControl("liTabTest");
    li.Attributes.Add("class","TabPanelTabbedSelected");
}

不确定 HtmlGenericControl 在这里是否正确,或者它是否具有 CssClass 属性,但我希望您能理解。如果服务器端没有 li 的直接表示,您还可以绑定字符串文字或使用 Literal 控件。

于 2012-07-24T18:48:12.783 回答
0

我的问题的答案是:中继器就像一个数组。所以我可以像这样得到转发器的第一个和最后一个元素:

string currClass =  hc.Attributes["class"].ToString();
string count = e.Item.Controls.Count.ToString();
        if (e.Item.ItemIndex == 0)
                    {
                        currClass += " TabbedPanelsTabSelected";
                    }
     else if (e.Item.ItemIndex.ToString() == count)
                    {
                        currClass += " last";
                    }

通过这种方式,我可以通过Repeater将css添加到我的第一个元素和最后一个元素。

于 2012-07-26T22:14:50.150 回答