Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    Regular Coder
    Join Date
    Sep 2002
    Posts
    143
    Thanks
    0
    Thanked 0 Times in 0 Posts

    strange behavior when removing option from select

    Hello
    i have strange thing when im trying to remove option from options collection
    when the right scroller of the selectbox is in the middle of the its scrll(or scroll path or what ever to call it)
    then im trying to delete the top must visible option whit the foo(i) function you will see blank space that this option leaves
    and when you press this blank space you will see duplication of the option that was under the option i removed.....
    why?
    here is the sample code:
    just important note: this only happens when the select scroller is somewhere but not in it top default position
    and the option you try to remove is the top must visible option.
    otherwise it not gona work
    --------------------------------------------------------------------------------------------------
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <script>
    function foo(i){
    document.all['Operation'].options[i]=null;
    }
    </script>
    </HEAD>
    <BODY>
    <select size=5 name="Operation" style="width:400px" >
    <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>
    <option>10</option>
    <option>11</option>
    <option>12</option>
    <option>13</option>
    <option>14</option>
    <option>15</option>
    <option>16</option>
    <option>17</option>
    <option>18</option>
    <option>19</option>
    </select>
    <br>
    <input type="button" onclick="foo(document.all['Operation'].options.selectedIndex)">
    </BODY>
    </HTML>
    --------------------------------------------------------------------------------------------------

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    Zwolle, The Netherlands
    Posts
    1,120
    Thanks
    2
    Thanked 31 Times in 31 Posts
    try
    Code:
    function foo(i){
    document.all['Operation'].remove(i)
    }
    I am the luckiest man in the world

  • #3
    Regular Coder
    Join Date
    Sep 2002
    Posts
    143
    Thanks
    0
    Thanked 0 Times in 0 Posts
    nop .. the same

  • #4
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    try

    function foo(i){
    document.all['Operation'].options.i=null;
    }
    and

    onclick="foo('selectedIndex')">

    That seems , at least, correct to me to use an argument...
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #5
    Regular Coder
    Join Date
    Jun 2002
    Posts
    166
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Maybe

    <form>
    <select size=5 name="Operation" style="width:400px">
    <option value= "0">0</option>
    <option value= "1">1</option>
    <option value= "2">2</option>
    ......
    </select>
    </form>

  • #6
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    No, paullete, the function uses selectedIndex, not value but, who knows, maybe it a good ideea to use value somehow...
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #7
    Regular Coder
    Join Date
    Nov 2002
    Posts
    596
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Wow...strange indeed. Haven't seen this one before. Seems to have something to do with the repaint of the altered select - which isn't being done properly - but, why...who knows? This seems to fix it (X-browser, too):
    Code:
    <html>
    <head>
    <title> New Document </title>
    <script type="text/javascript">
    
    function delSelOpt(oSelect) {
        var idx = oSelect.selectedIndex;
        oSelect.options[idx] = null;
        oSelect.selectedIndex = 0;
        oSelect.selectedIndex = idx;
    }
    
    </script>
    </head>
    <body>
    <select size=5 name="Operation" style="width:400px" >
    <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>
    <option>10</option>
    <option>11</option>
    <option>12</option>
    <option>13</option>
    <option>14</option>
    <option>15</option>
    <option>16</option>
    <option>17</option>
    <option>18</option>
    <option>19</option>
    </select>
    <br>
    <input type="button" value="Delete Selected Option" onclick="delSelOpt(Operation)">
    </body>
    </html>
    Jerking it around seems to wake it up. Maybe someone else knows a standard fix for this.

  • #8
    Senior Coder
    Join Date
    Jun 2002
    Location
    frankfurt, german banana republic
    Posts
    1,848
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Just to add to the confusion: I am not able to reproduce the buggy behaviour in IE5.5 on Win2k. No blank space left.
    It's better to use a form tag around form elements though, and to access the form not by document.all.
    De gustibus non est disputandum.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •