views:

289

answers:

1

hi all, i am new to javascript.. i have two select boxes with multiple selection enabled.When i select an element from first select box it scrolls into view the corrosponding element from the second list.The single selection goes fine in all browsers explorer,firefox,chrome. now, if i select the first,last element from the first selection box the second select box does not scrolls into view the last selected element in chrome browser.although , it works fine in internet explorer and firefox but not in google chrome browser.please tell me where i am wrong or is it there a better way to do the same.

<html>
<head>
<script language="javascript"> 
function SyncListsL(){
for (var i = 0; i <= [document.puser.user_select.length]-1; i++) {
    if(document.puser.user_select.options[i].selected == true)
    {
      document.puser.user_select2.options[i].selected=true;        document.puser.user_select.options[i].selected=true;
    }
    else{
        document.puser.user_select2.options[i].selected = false;
        document.puser.user_select.options[i].selected=false;
    }
} 
}
function SyncListsR(){ 
for (i = 0; i <= [document.puser.user_select2.length]-1; i++) {
    if(document.puser.user_select2.options[i].selected == true)
    {
document.puser.user_select.options[i].selected=true;               document.puser.user_select2.options[i].selected=true;
        }
    else{
        document.puser.user_select.options[i].selected = false;
        document.puser.user_select2.options[i].selected=false;
    }
} 
}
</script>
<title>scrollintoview</title>
</head>
<body bgcolor="e2dbc5">
<form name="puser" > 
<table align="center">
  <tr> 
<td align="right"  bgcolor="#eeeadd"> <font size=2>
    <select name="user_select2" multiple size="5" onChange="SyncListsR()" style="width:35mm">  
    <option value="a1" title="a1">a1</option>   
          <option value="a2" title="a2">a2</option>   
          <option value="ab" title="ab">ab</option>   
          <option value="abc" title="abc">abc</option>   
          <option value="e1" title="e1">e1</option>     
          <option value="e2" title="e2">e2</option>   
          <option value="new" title="new">new</option>   
          </select>
    </font></td>
  <td align="left" bgcolor="#eeeadd"> <font size=2>
     <select name="user_select"  multiple size="5" onChange="SyncListsL()" style="width:50mm">           
      <option value="first" title="first">first</option>          
      <option value="last" title="last">last</option>          
      <option value="ghi" title="ghi">ghi</option>           
      <option value="User" title="User">User</option>          
      <option value="ed" title="ed">ed</option> 
      <option value="edit" title="edit">edit</option> 
      <option value="second" title="second">second</option>
       </select>
      </font></td>
</tr>
 </table>
</form>
</body>
</html>
A: 

It's happening when ur using your mouse?
Might be related to this bug.

Knu