Getting data from TreeList client side

[tim]

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

[Veli]

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

[tim]

Hi Veli,

Thanks for the response, this does the trick alright.