通过中继器添加CSS类中继器、CSS

2023-09-04 06:06:02 作者:酸性脾气^

我有一个中继器动态地生成选项卡链接使用Sitecore的(SC:链接)是这样的:

I have a repeater which dynamically generate tab links using Sitecore (sc:Link) like this:

<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:

I manipulate the CSS via JS:

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获取调用和CSS是越来越每次执行的第一个项目。

Unfortunately, this is not working because each tab is a separate .ASPX page, so the page is getting rendered again and that is why Init() in JS is getting called and CSS is getting executed to the first item everytime.

这是我的code背后:

This is my code behind:

        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到code-落后,但它没有工作,因为我不能让标签(哪个选项卡是越来越选中)的索引。任何解决方案将AP preciated!谢谢!

I tried adding CSS through code-behind but it didnt work because I cannot get the index of the tab (which tab is getting selected). Any solution will be appreciated! Thanks!

推荐答案

在回答我的问题是:该转发器就像一个数组。因此,我可以得到这样一个中继器的第一个和最后一个元素:

The answer to my question is: The repeater is like an array. So I can get the 1st and Last element of a repeater like this:

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";
                    }

在这种方式,我可以添加CSS来我的第一个元素,并通过中继器的最后一个元素。

In this way I can add a css to my first element and the last element through Repeater.

 
精彩推荐
图片推荐