IE + ListBox scrolling to top after selection

golfman's picture

I have a problem that only occurs on IE (Version 7 - not tried it on IE6). The problem does not occur on Firefox (as it per usual!).

Scenario:

ListBox with say 12 items but only high enough to display 4 items.

Scroll down to bottom and click on any item near the bottom. The item becomes selected - yes - but the list box then scrolls back up to the top so that I no longer see the selected item.

Has anyone seen this before? Does anyone know a workaround or fix? I'm using 2.1rc3 but it's a problem that has been around since I started using Echo2 more than 12 months ago.

It's a very annoying user interface behaviour because the user expects to see a selected item after selecting something.

A while ago I had to add the listener to get single selection to work properly - do I need that still?

Here is the code that populates the ListBox:

           Object items[] = categoryContainerModelObject.getSubCategories().toArray();
            subCategoriesList.setModel(new DefaultListModel(items));
            subCategoriesList.setSelectionMode(ListSelectionModel.SINGLE_SELECTION);
            subCategoriesList.addActionListener(new ActionListener() {
                public void actionPerformed(ActionEvent e) {
                    // Do nothing - we just need to add the listener so that
                    // single selection works properly
                }
            });

golfman's picture

When I remove the list box

When I remove the list box listener it works perfectly on both IE and FireFox.

Obviously the single select mode problem has been fixed so the redundant listener is no longer needed - excellent.

Step Ahead Software
Makers of Javelin Modeler+Coder for Java.
Automatic persistence of your object model using JDO and Hibernate.
<a href="http//stepaheadsoftware.com/products/javelin/javelin.htm" target="_blank">Javelin Home Page</a>

Don't know whether its a bug

Don't know whether its a bug or a feature, but I posted a workaround a couple of weeks back - I don't know how you link to an old message in this forum, so here's a copy of the relevant bit:

As you have noticed, in its current implementation if an ActionListener is defined ListBox re-renders after performing the server actions. you can get round this by changing the renderUpdate function in the ListComponent peer to something similar to :

public boolean renderUpdate(RenderContext rc, ServerComponentUpdate update, String targetId) {
// IRB don't update if selection changed
String [] ups = update.getUpdatedPropertyNames();
if( !(ups.length == 1 && ups[0].compareToIgnoreCase("listSelectionChanged") == 0)){
// Determine if fully replacing the component is required.
if (partialUpdateManager.canProcess(rc, update)) {
partialUpdateManager.process(rc, update);
} else {
// Perform full update.
DomUpdate.renderElementRemove(rc.getServerMessage(), ContainerInstance.getElementId(update.getParent()));
renderAdd(rc, update, targetId, update.getParent());
}
}
return true;
}
This stops it re-rendering if the message being processed is a selectionchanged. Unfortunately it doesn't do anything about scrolling the current selection into view when the listbox is rendered, I think thats an issue with the javascipt for the component.

Hope this helps

Iain

This workaround doesn't seem

This workaround doesn't seem to work if I need to set a list box's selected index within my code, rather than clicking on it in the interface. In other words, if I have a line "listbox.setSelectedIndex(0,true);" this does not result in the listbox highlighting the item at index 0 as it should. Could this workaround be fixed so that setSelectedIndex will still work?