ScottC
ScottC

Reputation: 162

ASP.NET Repeater Not Outputting HTML Expectedly

I have a repeater in which I want to show adverts. My problem was whether the repeater contained an URL, if it did wrap the image in a hyperlink, if not just show an image. To do this I used OnItemDataBound.

HTML

<div class="col-12 text-center">
    <!-- Advert column -->
    <asp:Panel ID="pnl_Adverts" runat="server">
        <asp:Repeater ID="rpt_Adverts" runat="server" OnItemDataBound="rpt_Adverts_ItemDataBound">
            <ItemTemplate>
                <div class="row advert_row">
                    <asp:Panel ID="pnlAds" runat="server">
                    </asp:Panel>
                </div>
            </ItemTemplate>
        </asp:Repeater>
    </asp:Panel>
</div>

On ItemDataBound I guessed it was the best way to check if the url existed and show a hyperlink. I tried hiding the hyperlink using Javascript but it hid the image as well.

ItemDataBound

protected void rpt_Adverts_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
    //Get this data item as a datarow
    DataRowView drv = e.Item.DataItem as DataRowView;

    //Get the url
    string url = drv.Row["url"].ToString();

    //Check if there is an url
    if (url.Length > 0)
    {
        //Create a hyperlink with an image
        HyperLink hlAdvert = new HyperLink()
        {
            ImageUrl = Resources.Main.Url + "/images/ads/" + drv.Row["img"],
            NavigateUrl = drv.Row["url"].ToString(),
            Target = "_blank",
            ToolTip = "Visit",
        };

        //Add nofollow attribute to this hyperlink
        hlAdvert.Attributes.Add("rel", "nofollow");

        //Add this image link to the advert panel
        pnl_Adverts.Controls.Add(hlAdvert);
    }
    else
    {
        //Create an image
        Image imgAd = new Image()
        {
            ImageUrl = Resources.Main.Url + "/images/ads/" + drv.Row["img"],
            AlternateText = "Advert"
        };

        //Add the image to the advert panel
        pnl_Adverts.Controls.Add(imgAd);
    }
}

This is how it outputted, I'm not sure why but it didn't add the hyperlinks to the panel even though I specifically added the hyperlink control to the ASP panel.

<div class="col-12 text-center">
    <!-- Advert column -->
    <div id="pnl_Adverts">

        <div class="row advert_row">
            <div id="rpt_Adverts_pnlAds_0">
            </div>
        </div>

        <div class="row advert_row">
            <div id="rpt_Adverts_pnlAds_1">
            </div>
        </div>

        <a title="Visit" rel="nofollow" href="/advertising" target="_blank">
            <img title="Visit" src="/images/ads/advertise_here.png" alt="" /></a><a title="Visit" rel="nofollow" href="/advertising" target="_blank"><img title="Visit" src="/images/ads/advertise_here.png" alt="" /></a>
    </div>
</div>

This is what I am expecting.

<div class="col-12 text-center">
    <!-- Advert column -->
    <div id="pnl_Adverts">
        <div class="row advert_row">
            <div id="rpt_Adverts_pnlAds_0">
                <a title="Visit" rel="nofollow" href="/advertising" target="_blank">
                    <img title="Visit" src="/images/ads/advertise_here.png" alt="" /></a>
            </div>
        </div>
        <div class="row advert_row">
            <div id="rpt_Adverts_pnlAds_1">
                <a title="Visit" rel="nofollow" href="/advertising" target="_blank">
                    <img title="Visit" src="/images/ads/advertise_here.png" alt="" /></a>
            </div>
        </div>
    </div>
</div>

Upvotes: 0

Views: 122

Answers (1)

VDWWD
VDWWD

Reputation: 35544

It looks like you are targeting the wrong Panel to add your HyperLinks. You need Panel pnlAds. So use FindControl in the ItemDataBound event and use the correct one.

protected void rpt_Adverts_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
    Panel pnl = e.Item.FindControl("pnlAds") as Panel;

    if (url.Length > 0)
    {
        pnl.Controls.Add(hlAdvert);
    }
    else
    {
        pnl.Controls.Add(imgAd);
    }
}

Upvotes: 2

Related Questions