TreeList Header - Client-side Click event

[Paul]

Hi,

I am using the RadTreeList (Ajax) and trying to get a client-side click event for a left click on the header. This does not appear to be directly supported by the control.  Is there an indirect way to get a client-side click event for the header row and determine the column of the event?

 

Thanks

[Marin Bratanov]

Hello Paul,

You can easily use jQuery and get the text of the header, if that works for you

<script>
    function OnTreeListCreated(sender, args) {
        $telerik.$(sender.get_element()).delegate(".rtlHeader th", "click", function (evt) {
            alert($telerik.$(evt.target).text());
        })
    }
</script>
<telerik:RadTreeList RenderMode="Lightweight" ID="RadTreeList1" runat="server" AllowSorting="True" DataSourceID="SqlDataSource1" DataKeyNames="LocationID"
    ParentDataKeyNames="ParentLocationID" AllowPaging="true" PageSize="7" AutoGenerateColumns="false">
        <ClientSettings>
            <ClientEvents OnTreeListCreated="OnTreeListCreated" />
        </ClientSettings>
    <Columns>
        <telerik:TreeListBoundColumn DataField="LocationID" HeaderText="LocationID"></telerik:TreeListBoundColumn>
        <telerik:TreeListBoundColumn DataField="LocationName" HeaderText="Name">
        </telerik:TreeListBoundColumn>
        <telerik:TreeListBoundColumn DataField="Population" HeaderText="Population" DataFormatString="{0:#,#}">
            <HeaderStyle HorizontalAlign="Right"></HeaderStyle>
            <ItemStyle HorizontalAlign="Right"></ItemStyle>
        </telerik:TreeListBoundColumn>
        <telerik:TreeListBoundColumn DataField="Area" HeaderText="Area" DataFormatString="{0:#,# km<sup>2</sup>}">
            <HeaderStyle HorizontalAlign="Right"></HeaderStyle>
            <ItemStyle HorizontalAlign="Right"></ItemStyle>
        </telerik:TreeListBoundColumn>
    </Columns>
</telerik:RadTreeList>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:TelerikConnectionString %>"
    SelectCommand="SELECT [LocationID], [LocationName], [Population], [Area], [ParentLocationID] FROM [WorldLocations]"></asp:SqlDataSource>

Regards,

Marin Bratanov
Telerik by Progress

[Paul]

Thanks for the quick response. I'm not using jquery, but with your response it was an easy conversion. Thanks.