New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

OnClientLoad

The OnClientLoad event is raised when the RadTileList object is initialized. It can notify the developer that the control isavailable (e.g. to store a reference to its client-side object for later use). For example, event handlers can be attached dynamically through the Client-side API of the RadTileList.

The event handler receives two arguments:

  1. the RadTileList object that fired the event

  2. an empty event arguments object

The following example shows how to set the SelectionMode of a RadTileList in its OnClientLoad event.

<telerik:RadTileList RenderMode="Lightweight" runat="server" ID="RadTileList1" OnClientLoad="OnClientLoad" AutoPostBack="true">
    <Groups>
        <telerik:TileGroup>
            <telerik:RadTextTile Name="Sample Text Tile" Text="Lorem ipsum dolor sit amet" Title-Text="Sample"></telerik:RadTextTile>
        </telerik:TileGroup>
    </Groups>
</telerik:RadTileList>

<telerik:RadCodeBlock runat="server" ID="RadCodeBlock1">
    <script type="text/javascript">
        function OnClientLoad(sender, args) {
            var tileList = $find("<%= RadTileList1.ClientID %>");

            tileList.set_selectionMode(Telerik.Web.UI.TileList.TileListSelectionMode.Single);
            //equivalent to tileList.set_selectionMode(2);

            //tileList.set_selectionMode(Telerik.Web.UI.TileList.TileListSelectionMode.None);
            //equivalent to tileList.set_selectionMode(1); 

            //tileList.set_selectionMode(Telerik.Web.UI.TileList.TileListSelectionMode.Multiple);
            //equivalent to tileList.set_selectionMode(4);

            alert(String.format("Selection Mode set to: Single, ({0})", tileList.get_selectionMode()));
        }
    </script>
</telerik:RadCodeBlock>

The code snippet below demonstrates how an event handler can be attached in the OnClientLoad event of the RadTileList.

        <telerik:RadTileList RenderMode="Lightweight" runat="server" ID="RadTileList1" OnClientLoad="OnClientLoad" AutoPostBack="false">
            <Groups>
                <telerik:TileGroup>
                    <telerik:RadTextTile Name="Sample Text Tile" Text="Lorem ipsum dolor sit amet" Title-Text="Sample"></telerik:RadTextTile>
                </telerik:TileGroup>
            </Groups>
        </telerik:RadTileList>

        <script type="text/javascript">
            function OnClientLoad(tileList, args) {
                tileList.add_tileClicked(OnTileClickHandler);
            }

            function OnTileClickHandler() {
                alert('A Tile is clicked.');
            }
        </script>
In this article