window.setTimeout is your friend.
To scroll the selection into view in your second example in IE, you may
replace the last line of code in addit with:
window.setTimeout(function(sel){return function() {
sel.options[sel.options.length - 1].selected=true;}}(sel),50);
Csaba Gabor from Vienna
(yes I know it's a top post - I had my reasons)
johkar wrote:
> Why does this code work in IE and Firefox and the second example does
> not work in IE. While these are just sample scripts, my actual scripts
> will be transferring options from one multi-select list to another. I
> want the most recently added one to scroll into view.
>
> Works in both:
> <html>
> <head>
> <title>test</title>
> </head>
> <body>
> <form>
> <select name="a" multiple size="5" style="width:200px">
> <option>1</option>
> <option>2</option>
> <option>3</option>
> <option>4</option>
> <option>5</option>
> <option>6</option>
> <option>7</option>
> <option>8</option>
> <option>9</option>
> </select>
> <input type="button" value="Set"
> onclick="this.form.elements['a'].options[8].selected=true">
> </form>
> </body>
> </html>
>
> Does not work in IE. Added option not scrolled into view.
> <html>
> <head>
> <script type="text/javascript">
> function addit(myForm,myElm){
> var opt = new Option('my new option', 'value');
> var sel = myElm;
> sel.options[sel.options.length - 1].selected=false;
> sel.options[sel.options.length] = opt;
> sel.options[sel.options.length - 1].selected=true;
> }
> </script>
> </head>
> <body>
> <form>
> <select name="a" multiple size="5" style="width:200px">
> <option>1</option>
> <option>2</option>
> <option>3</option>
> <option>4</option>
> <option>5</option>
> <option>6</option>
> <option>7</option>
> <option>8</option>
> <option>9</option>
> </select>
> <input type="button" value="Set"
> onclick="addit(this.form,this.form.elements['a'])">
> </form>
> </body>
> </html>
Received on Mon May 1 05:27:17 2006