This is a migrated thread and some comments may be shown as answers.

Repeater with Tiles

4 Answers 85 Views
TileList
This is a migrated thread and some comments may be shown as answers.
moegal
Top achievements
Rank 1
moegal asked on 03 Nov 2013, 04:45 PM
I am trying to use a RadContentTemplateTile in an asp:Repeater but the bindings are blank?  Any ideas?

<asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">
                <ItemTemplate>
                    <telerik:RadContentTemplateTile ID="RadContentTemplateTile1" runat="server"
                        Skin="Telerik">
                        <ContentTemplate>
                            <div>
                                Name:<%# Eval("Name")%>
                            </div>
 
                        </ContentTemplate>
                        <PeekTemplate>
                            <div>
                                peek here
                                <telerik:RadButton ID="RadButton2" runat="server" Text="RadButton"></telerik:RadButton>
                            </div>
                        </PeekTemplate>
                        <PeekTemplateSettings Animation="Slide" ShowPeekTemplateOnMouseOver="true" HidePeekTemplateOnMouseOut="true" />
                    </telerik:RadContentTemplateTile>
                </ItemTemplate>
 
            </asp:Repeater>


Marty

4 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 04 Nov 2013, 07:28 AM
Hi Marty,

You must use the <DataBindings> tag to data bind the RadTile. Please have a look into the following sample code I tried for your scenario.

ASPX:
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
    ProviderName="System.Data.SqlClient" SelectCommand="SELECT top 4 [CustomerID], [ContactName] FROM [Customers]">
</asp:SqlDataSource>
<telerik:RadTileList runat="server" DataSourceID="SqlDataSource1" ID="RadTileList1"
    OnTileCreated="RadTileList1_TileCreated">
    <DataBindings>
        <CommonTileBinding TileType="RadContentTemplateTile" />
        <ContentTemplateTileBinding>
            <ContentTemplate>
                <div style="padding-top: 45px">
                    <strong>CustomerID:</strong>
                    <%#DataBinder.Eval(Container.DataItem, "CustomerID")%>
                    <br />
                    <strong>ContactName:</strong>
                    <%#DataBinder.Eval(Container.DataItem, "ContactName")%>
                </div>
            </ContentTemplate>
        </ContentTemplateTileBinding>
        <TilePeekTemplate>
            <div>
                peek here
                <telerik:RadButton ID="RadButton2" runat="server" Text="RadButton">
                </telerik:RadButton>
            </div>
        </TilePeekTemplate>
    </DataBindings>
</telerik:RadTileList>

C#:
protected void RadTileList1_TileCreated(object sender, Telerik.Web.UI.TileListEventArgs e)
{
    e.Tile.PeekTemplateSettings.ShowInterval = 0;
    e.Tile.PeekTemplateSettings.CloseDelay = 0;
    e.Tile.PeekTemplateSettings.ShowPeekTemplateOnMouseOver = true;
    e.Tile.PeekTemplateSettings.HidePeekTemplateOnMouseOut = true;
    e.Tile.PeekTemplateSettings.AnimationDuration = 800;
}

Thanks,
Shinu.
0
moegal
Top achievements
Rank 1
answered on 04 Nov 2013, 10:16 AM
Shinu,

Thanks, but I don't want a tilelist.  I just want to use the Tiles standalone in a repeater. Get the benefit of peek templates.

Marty

0
Accepted
Marin Bratanov
Telerik team
answered on 04 Nov 2013, 11:26 AM
Hello Marty,

Indeed, databinding expressions are not evaluated in this case. I am logging this for improvement and I have also updated your Telerik points for your report.

In the meantime I can suggest the following workaround:
protected void Repeater1_OnItemDataBound(object sender, RepeaterItemEventArgs e)
{
    RadContentTemplateTile tile = e.Item.FindControl("RadContentTemplateTile1") as RadContentTemplateTile;
    if(tile != null)
    {
        Label literal = tile.ContentContainer.FindControl("Label1") as Label;
        if(literal != null)
        {
            literal.Text = (e.Item.DataItem as DataRowView)["Name"].ToString();
        }
    }
}

<asp:Repeater ID="Repeater1" runat="server" OnItemDataBound="Repeater1_OnItemDataBound">
    <ItemTemplate>
        <telerik:RadContentTemplateTile ID="RadContentTemplateTile1" runat="server" Skin="Telerik">
            <ContentTemplate>
                <div>
                    Name: <asp:Label ID="Label1" Text="" runat="server" />
                </div>
            </ContentTemplate>
            <PeekTemplate>
                <div>
                    peek here
                    <telerik:RadButton ID="RadButton2" runat="server" Text="RadButton">
                    </telerik:RadButton>
                </div>
            </PeekTemplate>
            <PeekTemplateSettings Animation="Slide" ShowPeekTemplateOnMouseOver="true" HidePeekTemplateOnMouseOut="true" />
        </telerik:RadContentTemplateTile>
    </ItemTemplate>
</asp:Repeater>


Regards,
Marin Bratanov
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
moegal
Top achievements
Rank 1
answered on 04 Nov 2013, 12:37 PM
Marin,

Thanks.  I figured this was the direction I needed to go but did not know where to start.

Marty
Tags
TileList
Asked by
moegal
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
moegal
Top achievements
Rank 1
Marin Bratanov
Telerik team
Share this question
or