Getting data from TreeList client side

3 posts, 1 answers
  1. tim
    tim avatar
    7 posts
    Member since:
    Mar 2010

    Posted 22 Feb 2011 Link to this post

    Hi,

    I have a TreeList display data. On a item select (or whatever) I want to get some data on the selected item. I have the following:

    function ItemSelected(sender, args) {
                   var treelist = $find("<%= radTreeList.ClientID %>");
                   var selectedIndexes = treelist.get_selectedIndexes();
                     
                   var row = selectedIndexes[0];
                   var item = treelist.getItem(row);

    which give me back the selected item. How do I get specific information from this. i.e. if I have a column called 'Name'?

    Thanks
  2. Answer
    Veli
    Admin
    Veli avatar
    2002 posts

    Posted 24 Feb 2011 Link to this post

    Hello tim,

    Currently, RadTreeList does not have any client APIs for retrieving a data item cell by column unique name. You can implement a javascript method to do that for you:

    function getCellByColumnUniqueName(item, columnName)
    {
        var treeList = item.get_owner();
        var headerRow = treeList.get_element().getElementsByTagName("thead")[0].rows[0];
        var columnIndex = -1;
        var cellsToSkip = item.get_hierarchicalIndex().NestedLevel + 1;
     
        for (var i = 0; i < headerRow.cells.length; i++)
        {
            var cell = headerRow.cells[i];
            var currentColumnName = "";
            var sortLink = cell.getElementsByTagName("a")[0]
     
            if (sortLink)
            {
                currentColumnName = sortLink.innerHTML;
            }
            else
            {
                currentColumnName = cell.innerHTML;
            }
     
            if (currentColumnName === columnName)
            {
                columnIndex = i;
                break;
            }
        }
                     
        if (columnIndex > -1)
        {
            return item.get_element().cells[cellsToSkip + columnIndex];
        }
     
        return null;
    }

    The above method will retrieve a table from the provided TreeListDataItem client object form a given column name. You can use it in your code like this:

    function ItemSelected(sender, args) {
    var treelist = $find("<%= radTreeList.ClientID %>");
    var selectedIndexes = treelist.get_selectedIndexes();
      
    var row = selectedIndexes[0];
    var item = treelist.getItem(row);
     
    var priceCell = getCellByColumnUniqueName(item, "Price")
    //priceCell is now your TD element corresponding to the "Price" column

    Note that the column name must match the text in the header cell (or the text in the sort button if sorting is enabled). Thus, if your column definition has a HeaderText different than its UniqueName property, you need to specify the HeaderText value in the above method call.

    Greetings,
    Veli
    the Telerik team
    Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. tim
    tim avatar
    7 posts
    Member since:
    Mar 2010

    Posted 24 Feb 2011 Link to this post

    Hi Veli,

    Thanks for the response, this does the trick alright.

Back to Top