Search code examples
c#asp.netevalhref

How to add ID on click of a href

In my Project, I have different types of Lighting categories. Each category has its ID. now In My UI, If I select particular category, its pics should be displayed in repeater. I don't know how to give ID in a href tag.

My HTML:

<ul class="filter text-center">
            <li><a data-cat="all" href="#All" class="active">All</a></li>
            <li><a data-cat="Dynamite" href="#DynamiteLounge">Dynamite Lounge</a></li>
            <li><a data-cat="Morsel" href="#Morsel">The Morsel Restaurant & Banquet</a></li>
            <li><a data-cat="Shagun" href="#Shagun">Shagun Hotel</a></li>
            <li><a data-cat="Shops" href="#Shops">Shops</a></li>
            <li><a data-cat="Bunglows" href="#Bunglows">Bunglows</a></li>
        </ul>

<div class="bf-single-item" id="All">
        <asp:PlaceHolder ID="plcAll" runat="server">
        <asp:Repeater ID="rptrAll" runat="server">
        <ItemTemplate>
        <div class="bf-single-item">
        <asp:Image ID="imgAll" runat="server" ImageUrl='<%# Eval("ImageAll")%>' />
        <div class="caption">
                        <%--<div class="cap-in">
                            <h3>
                                CN Lighting</h3>
                                <div class="bflink-preview">
                                <a href='<%# Eval("ImageAll") %>' rel="prettyPhoto">Zoom In</a>
                            </div>--%>
        </div>
        </ItemTemplate>
        </asp:Repeater>
        </asp:PlaceHolder>
        </div>

<div class="bf-single-item" id="DynamiteLounge">
        <asp:PlaceHolder ID="plcDynamiteLounge" runat="server">
        <asp:Repeater ID="rptrDynamiteLounge" runat="server">
        <ItemTemplate>
        <div class="bf-single-item">
        <asp:Image ID="imgDynamiteLounge" runat="server" ImageUrl='<%# Eval("ImageDynamiteLounge") %>' />
        <div class="caption">
                        <div class="cap-in">
                            <h3>
                                CN Lighting</h3>
                                <%--<div class="bflink-preview">
                                <a href='<%# Eval("ImageAll") %>' rel="prettyPhoto">Zoom In</a>
                            </div>--%>
        </div>
        </ItemTemplate>
        </asp:Repeater>
        </asp:PlaceHolder>
        </div>

.

.

.

In this code, as you can see I have <a href in <li> and I have given href as a div Ids . See image. how to pass ID?

Like this

Solution

  • markup

    <asp:LinkButton runat="server" Text="All" OnClick="LinkButton_Click"></asp:LinkButton>

    protected void LinkButton_Click(object sender, EventArgs e)
{
    var id = (sender as LinkButton).Attributes["data-cat"];

    if(id == "All")
        DoSomething();
}

    your id cannot be retrieved like this in the code behind, but from ASP.NET 4 there is the Control.ClientID property that could help you.

    Assuming instead that you wanted this client-side 

    document.getElementsByTagName('a').forEach(function(elem){
    elem.addEventListened(click_handler);
});

function click_handler(){
    var id = this.id;
    if(id == 'All')
        doSomething();
}

    assuming that you know the Array.prototype.forEach method