Question

I have the following problem.

I have a tree view control in .NET and I have created a autocomplete search box to search the tree for a name – which then I can select and it highlights the item with a selected class.

The tree view is pretty long so I have given it a height and overflow scroll.

The problem is that I want view or scroll down to the selected item when I’ve searched for it.

So i have created the following script to scrollIntoView it but this doesn’t seem to work:

function search_itemSelected(sender, e) {
        var hdSearchID = $get('<%= hdSearchID.ClientID %>');
        hdSearchID.value = e.get_value();
        var selectedElement = $("div.node.cen.selected"); // This works
        if (selectedElement != null) {
            selectedElement[0].scrollIntoView = 10; // This keeps coming back as undefined
        }
    }

Answer 1

First: change

if (selectedElement != null)

to

if (selectedElement.length)

because $("div.node.cen.selected"); will never return null. jQuery always returns a jQuery object (empty or not, but a jQuery object)

So in the case where it is empty, the selectedElement[0] will return undefined and thus the scrollIntoView does not exist..

Second: scrollIntoView is a function and so you do not assign a value to it. You need to call it with

selectedElement[0].scrollIntoView();