473,320 Members | 2,193 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

How to scroll OPTION into view?

Is there a way to scroll a selected OPTION into view?

I have a combination of text box and SELECT list. A user can key in
text in the text box, and depending on the entry made, the respective
option in the list is to be highlighted. Somewhat like an
autocolmplete... I have been able to achieve this, however, if the
position/index of the selected option is beyond the SIZE of the SELECT
list, then the OPTION positions itself at the bottom of the list.

Is there a way to scroll the selected OPTION into view? I would not
want to interchange the indexes of the OPTIONs, but merely scroll the
OPTION to be viewed at the top within the list area.

The target browser is IE 5.0+. Hence, a MS compliant solution will
also do.

Advice and suggestions solicited.

Regards,
Rithish.
Jul 23 '05 #1
3 11145
Rithish Saralaya wrote:
[...]
Is there a way to scroll the selected OPTION into view? I would not
want to interchange the indexes of the OPTIONs, but merely scroll the
OPTION to be viewed at the top within the list area.

[...]

As far as I can tell, no. In a single select list, the selected item
is always made visible, but in a multi-select list (I'm guessing that
is what you are using) it does not scroll if the selected item is
out-of-view (i.e. off the bottom of the visible area).

Even if you set an out-of-view option as selected in the HTML, it
remains out of view, even though it's selected. I guess the idea is
that if more than one is selected and the browser can't show both
simultaneously, then which one does it show?

C'est la vie

Rob.
Jul 23 '05 #2
RobG <rg***@iinet.net.auau> wrote in message news:<41**********************@per-qv1-newsreader-01.iinet.net.au>...
As far as I can tell, no. Actually speaking, this has been achieved too. However, I wasn't
confident of the solution. I do a 2-step selection. I select another
OPTION some indices below, and then select the actual OPTION. If I
have a SELECT list of 100 options of size 10, and the 50th OPTION is
to be selected, then, I first select the OPTION of index 60 ( required
OPTION index + list size ), and then select the OPTION of index 50.
This brings the 50th OPTION as the first item in the visible area.
But, as I said, I wasn't too confident of the solution. I wanted to
know if there were some methods like scrollToTop or something that
could be applied....
In a single select list, the selected item is always made visible, but in a multi-select list (I'm guessing that
is what you are using) it does not scroll if the selected item is
out-of-view (i.e. off the bottom of the visible area).

It is indeed a single select list..
Jul 23 '05 #3
Rithish Saralaya wrote:
RobG <rg***@iinet.net.auau> wrote in message news:<41**********************@per-qv1-newsreader-01.iinet.net.au>...

As far as I can tell, no.


Actually speaking, this has been achieved too. However, I wasn't
confident of the solution. I do a 2-step selection. I select another
OPTION some indices below, and then select the actual OPTION. If I
have a SELECT list of 100 options of size 10, and the 50th OPTION is
to be selected, then, I first select the OPTION of index 60 ( required
OPTION index + list size ), and then select the OPTION of index 50.
This brings the 50th OPTION as the first item in the visible area.
But, as I said, I wasn't too confident of the solution. I wanted to
know if there were some methods like scrollToTop or something that
could be applied....
In a single select list, the selected item
is always made visible, but in a multi-select list (I'm guessing that
is what you are using) it does not scroll if the selected item is
out-of-view (i.e. off the bottom of the visible area).


It is indeed a single select list..


I'd been mulling this over for a while, and finally got to test it.
I've run the following code in every browser I can, yet the right
option is always made visible when the button is clicked.

What browser are you having issues with? I've tested it in IE and it
works fine.

Cheers, Rob.

<form action="">
<select name="aSelect">
<option value="opt1">option 1
<option value="opt2">option 2
<option value="opt3">option 3
<option value="opt4">option 4
<option value="opt5">option 5
<option value="opt6">option 6
<option value="opt7">option 7
<option value="opt8">option 8
<option value="opt9">option 9
<option value="opt10">option 10
<option value="opt11">option 11
<option value="opt12">option 12
<option value="opt13">option 13
<option value="opt14">option 14
<option value="opt15">option 15
<option value="opt16">option 16
<option value="opt17">option 17
<option value="opt18">option 18
<option value="opt19">option 19
<option value="opt20">option 20
<option value="opt21">option 21
<option value="opt22">option 22
<option value="opt23">option 23
<option value="opt24">option 24
<option value="opt25">option 25
</select><br>
<input type="reset"><br><br>
<input type="text" cols="10" name="aNum">
Enter a number from 1 to 25 and that option will be selected<br>
<input type="button" value="click me" onclick="
var x = this.form.aNum.value;
if (x > 0 && x < 26) {
this.form.aSelect.options[x - 1].selected='true'
} else {
alert('From 1 to 25 please, ' + x + ' is out of bounds');
}
">
</form>
Jul 23 '05 #4

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

0
by: sumGirl | last post by:
Hi. I have an HTML app that includes a psuedo drop-down menu I created using some css and some vbs. It looks like so: ---------- | option1 <-- vertical scroll bar option2 | option3 |...
5
by: Aidan | last post by:
Greetings all, I'm trying to build a div based layout for a mambo template (work in progress), and I'm having a strange problem, 2 acctually, with scroll bars in IE. I've tried everything I can...
2
by: J Shrimps, Jr. | last post by:
Would like to remove both the "X" button and the scroll bars from Access 2000. Am planning on restricting exiting the database from a close button on each form button only. I believe some API...
2
by: Richard Hollenbeck | last post by:
Is there a way in Access that I could make it so that the end user could scroll up and down, or right and left, depending on the arrow keys depressed? In form view, instead of going left to right...
1
by: Jesper DK | last post by:
Hi, I have docked a tree view to the left on a form. When I start to populate this tree view with nodes, a horizontal scroll box appears in the bottom of the tree view even though thee tree...
6
by: isaac2004 | last post by:
hi am making a webpage for a client that has a lot of text on thier site, i have a photoshop template that i created and i want the text to fit in a small part of template, can anybody point me in...
1
by: bulldog8 | last post by:
I am working on a picture preview page ... some questions and suggestions have been incorporated already, but the 'user' (i.e. wife!) would like it to be more user friendly (if it isn't one thing,...
4
by: mkaszub | last post by:
Hi, I have a problem with combobox. On my form is many comboboxes and when I select same option and use my mouse roll, combobox change to next value. How to disable mouse roller? I tried to...
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
0
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.