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 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Apr 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Removing options from select based on text

    I have this bit of javascript:

    Code:
    selectBox = document.getElementById("IndexDropdown");
    badVar = "ORAL";
    
    
    for (i=0; i<selectBox.options.length; i++) {
      if (selectBox.options[i].text.search(badVar) != -1)  {
    	selectBox.options[i] = null;
      }
    }
    affecting this element:

    Code:
    <select onchange="SetPlayerPosition(this.options[this.selectedIndex].value,this)" style="width:100%" id="IndexDropdown">
    <option value="0:4595">16.	Oral Report on State and Local Redistricting Proposals.</option>
    <option value="0:5546">17.	Consideration of the Monthly Financial Report for the Period Ending February 28, 2011 (Staff Presentation.)</option>
    <option value="0:10727">ORAL REPORTS BY MEMBERS OF CITY COUNCIL</option>
    <option value="0:10729">ORAL PRESENTATIONS BY MEMBERS OF CITY COUNCIL</option>
    <option value="0:11427">ORAL REPORT FROM THE CITY MANAGER</option>
    <option value="0:15058">26.	Consideration of City Council Schedule.</option>
    </select>
    The code works to remove all options that include "ORAL" (case-sensitive) except for the last option that includes that string. I want it to remove ALL references. What am I doing wrong? When I run it twice it works, but that's not right.

  • #2
    New to the CF scene
    Join Date
    Apr 2011
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This is because your loop changes as you remove the nodes (i.e. selectBox.options indicies changed as soon as the first node was removed). You have to put all your deleted nodes into an array and then loop through that like this:

    selectBox = document.getElementById("IndexDropdown");
    deletedNodes = [];
    selectBoxLength = selectBox.options.length;
    badVar = "ORAL";
    for (i = 0; i < selectBoxLength; i++) {

    if ( /ORAL/.test(selectBox.options[i].innerHTML) ) {
    deletedNodes.push(selectBox.options[i]);
    }
    }
    for (i = 0; i < deletedNodes.length; i++) {
    selectBox.removeChild(deletedNodes[i]);
    }

  • #3
    Banned
    Join Date
    Feb 2011
    Posts
    2,699
    Thanks
    13
    Thanked 395 Times in 395 Posts
    Another option is to loop through the options starting from the last one and working back to the first option.

    Then delete each option that contains badVar apart from the first occurence which will be the last option with badVar in it.
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
            <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
            <title></title>
            <style type="text/css"></style>
            <script type="text/javascript">
            function SetPlayerPosition(obj){
                var count = 0;
                var badVar = 'ORAL';
                for(i=obj.length-1; i >=0; i--){
                    if(obj.options[i].innerHTML.indexOf(badVar) != -1 && ++count > 1){obj.options[i] = null;}
                }
            }
        </script>
        </head>
        <body>
            <select onchange="SetPlayerPosition(this)" style="width:100%" id="IndexDropdown">
                <option value="0:4595">16.    Oral Report on State and Local Redistricting Proposals.</option>
                <option value="0:5546">17.    Consideration of the Monthly Financial Report for the Period Ending February 28, 2011 (Staff Presentation.)</option>
                <option value="0:10727">ORAL REPORTS BY MEMBERS OF CITY COUNCIL</option>
                <option value="0:10729">ORAL PRESENTATIONS BY MEMBERS OF CITY COUNCIL</option>
                <option value="0:11427">ORAL REPORT FROM THE CITY MANAGER</option>
                <option value="0:15058">26.    Consideration of City Council Schedule.</option>
            </select>
        </body>
    </html>
    Last edited by bullant; 04-15-2011 at 06:04 AM.

  • #4
    Senior Coder Dormilich's Avatar
    Join Date
    Jan 2010
    Location
    Behind the Wall
    Posts
    3,253
    Thanks
    12
    Thanked 341 Times in 337 Posts
    Quote Originally Posted by bullant View Post
    Another option is to loop through the options starting from the last one and working back to the first option.
    some other variants of that "downloop".

    using while()
    PHP Code:
    var = list.length;
    while (
    i--) {
        
    doSomethingWith(list[i]);

    of course you can also code that as for()
    PHP Code:
    for (var = list.lengthi--;) {
        
    doSomethingWith(list[i]);

    Last edited by Dormilich; 04-15-2011 at 09:19 AM.
    The computer is always right. The computer is always right. The computer is always right. Take it from someone who has programmed for over ten years: not once has the computational mechanism of the machine malfunctioned.
    André Behrens, NY Times Software Developer

  • #5
    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
    You must remove the option using a backwards loop, in which case the length of the collection is irrelevant, as it will not affect the next element to be removed in a series.
    Code:
    for (var i=selectBox.options.length-1; i>=0; i--) {
      if (selectBox.options[i].text.search(badVar) != -1)  {
    	selectBox.options[i] = null;
      }
    }
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #6
    Banned
    Join Date
    Feb 2011
    Posts
    2,699
    Thanks
    13
    Thanked 395 Times in 395 Posts
    @op

    I misread your initial post.

    I've removed the counter from my initial post
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
            <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
            <title></title>
            <style type="text/css"></style>
            <script type="text/javascript">
            function SetPlayerPosition(obj){
                var badVar = 'ORAL';
                for(i=obj.length-1; i >=0; i--){
                    if(obj.options[i].innerHTML.indexOf(badVar) != -1){obj.options[i] = null;}
                }
            }
        </script>
        </head>
        <body>
            <select onchange="SetPlayerPosition(this)" style="width:100%" id="IndexDropdown">
                <option value="0:4595">16.    Oral Report on State and Local Redistricting Proposals.</option>
                <option value="0:5546">17.    Consideration of the Monthly Financial Report for the Period Ending February 28, 2011 (Staff Presentation.)</option>
                <option value="0:10727">ORAL REPORTS BY MEMBERS OF CITY COUNCIL</option>
                <option value="0:10729">ORAL PRESENTATIONS BY MEMBERS OF CITY COUNCIL</option>
                <option value="0:11427">ORAL REPORT FROM THE CITY MANAGER</option>
                <option value="0:15058">26.    Consideration of City Council Schedule.</option>
            </select>
        </body>
    </html>


  •  

    Tags for this Thread

    Posting Permissions

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