Friday, October 22, 2004
Scrolling a multiple select list
Sometimes something that seems so simple can turn out to be unbelievably difficult. One such problem that I resently ran into is the problem of scrolling an HTML select control to the last selected item after an ASP.NET postback. Normally if you select an item that is below the visible number of lines, if the list is in single select mode the control will automatically scroll to make the selected item visible. If the list is in multiple select mode, the list will not scroll and the fact that there are selections below the visible lines will not be known.
The key to solving this problem is to write javascript that reselects the last selected entry and then schedules this javascript to run after a few miliseconds. There is no javascript scroll command, and this fix will not work without the delayed asych execution. I have changed the script tag to 'scrpt' in order to overcome security checks on embedded javascript.
Private Sub Page_PreRender(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.PreRender 'build string to set the focus on the current control Dim sFocus As String If Not focusControl Is Nothing Then sFocus = String.Format( _ "try{{document.getElementById('{0}').focus();}}catch(x){{}}", _ focusControl.ClientID) End If 'build a string that will autoscroll the list boxes if they have selection that are not visible by default Dim sb As New System.Text.StringBuilder sb.Append("") sb.Append("function AutoScroll(){") sb.Append(sFocus) sb.Append(" var f = document.forms[0];") sb.Append("for (var num=0; num < ") sb.Append("f.elements.length;num++)") sb.Append("{") sb.Append("if (f.elements[num].type.indexOf('select')==0)") sb.Append("{") sb.Append("var si = f.elements[num].selectedIndex;") sb.Append("if (si >= 0) ") sb.Append("{") sb.Append("var maxi = f.elements[num].selectedIndex;") sb.Append("for (var i=maxi; i < ") sb.Append("f.elements[num].options.length;i++){") sb.Append("if(f.elements[num].options[i].selected){maxi=i}") sb.Append("}") sb.Append("var ooo = f.elements[num].options[maxi]; ") sb.Append("ooo.selected=true;") sb.Append("}") sb.Append("}") sb.Append("}") sb.Append("}") sb.Append(" ") sb.Append("") sb.Append("window.setTimeout(""AutoScroll()"",5)") sb.Append(" ") Page.RegisterStartupScript("radchk", sb.ToString) End Sub
Comments:
Post a Comment