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 5 of 5
  1. #1
    New Coder
    Join Date
    Jan 2009
    Posts
    41
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Evaluate drop-down based on text

    Curious about the following issue. I currently have a dynamic drop-down based on the value of each option.. If selection in top drop-down is B it will show all options with a B contained in the second/resulting drop-down.

    Now - I also want to evaluate the options by having the script check for a few keywords..

    Example - have it evaluate the drop-down on page load for options with text containing 'blah123' (ex. <option value="0323G">Qwerty - blah123</option>). And if any of the options have that text the script will generate an additional drop-down menu allowing you to select blah123 or other specified text. Say another thing I'd like to search each text string for is 'abump'. If there is 'blah123' and 'abump' contained within the drop-down, a third drop-down menu will be generated (as said before) with only blah123 and abump as options. Whichever of these is selected will narrow down the options available in the final drop-down menu.

    If any clarification is needed I would be more than happy to make this more clear. Any ideas?

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,171
    Thanks
    203
    Thanked 2,549 Times in 2,527 Posts
    Is this what you want?

    Code:
    <body onload = "find()">
    
    <form name="myform" id = "myform">
    <select name = "list1" id = "list1" >
    <option selected value=""> Choose A Fruit</option>
    <option value="Mango"> Mango </option>
    <option value="Apple"> Apple </option>
    <option value="Orange"> Orange </option>
    <option value="blah123"> Qwerty blah123 </option>
    <option value="abump"> Uiop abump Shrdlu</option>
    </form>
    
    <script type = "text/javascript">
    
    function find() {
    for (var i =0; i<document.myform.list1.length; i++) {
    var x = document.myform.list1[i].text;
    if (/blah123/.test(x)) {  // or if (/blah123/i.test(x)) { to make case insensitive
    alert ("blah123 was found at option list index " + i);
    }
    if (/abump/.test(x)) {
    alert ("abump was found at option list index " + i);
    }
    }
    
    }
    </script>
    "Dives sum, si non redo eis quibus debeo. - I am a rich man as long as I do not pay my creditors"
    Last edited by Philip M; 08-31-2009 at 07:46 PM.

  • Users who have thanked Philip M for this post:

    KyleVA (09-02-2009)

  • #3
    New Coder
    Join Date
    Jan 2009
    Posts
    41
    Thanks
    8
    Thanked 0 Times in 0 Posts
    Alright, also curious about one more thing..

    Say I have a drop-down like so..

    Code:
    <select>
    <option>OneOption</option>
    <option>AnotherOption</option>
    <option>OnceAgainAnotherOption</option>
    </select>
    and below it a drop down as follows:

    Code:
    <select>
    <option>Text - OneOption - Info</option>
    <option>Text - OneOption - Info</option>
    <option>Text - OneOption - Info</option>
    <option>Text - AnotherOption - Info</option>
    <option>Text - OnceAgainAnotherOption - Info</option>
    <option>Text - OnceAgainAnotherOption - Info</option>
    </select>
    What I need to do, is based on the text of the select option in the first drop-down it can only show options with that specific text in the second drop-down. So if you choose the OneOption option in the first drop-down you'll have three choices (the three Text - OneOption - Info) in the second drop-down.

    I know this seems extremely unefficient but it's what I have to work with, I'm wondering if this is possible?
    Last edited by KyleVA; 09-02-2009 at 07:23 PM.

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,171
    Thanks
    203
    Thanked 2,549 Times in 2,527 Posts
    Here is one way to do it:-

    Code:
    <html>
    <head>
    
    <script type = "text/javascript">
    
    function showOthers(which) {
    document.getElementById("selectbox1").style.display="none";
    document.getElementById("selectbox2").style.display="none";
    document.getElementById("selectbox3").style.display="none";
    var a = which.value;
    if (a > 0 && a <=3) {
    var b = "selectbox" + a;
    document.getElementById(b).style.display="block";
    }
    }
    
    </script>
    
    </head>
    <body>
    
    <select name = "sel0" id = "sel0" style="width:200px" onchange = "showOthers(this)">
    <option value = "0">Select an option</option>
    <option value = "1">OneOption</option>
    <option value = "2">AnotherOption</option>
    <option value = "3">OnceAgainAnotherOption</option>
    </select>
    
    <br><br>
    <div id = "selectbox1" style="display:none">
    
    <select name = "sel1" id = "sel1" style="width:200px">
    <option value = "0">Text - OneOption - Info</option>
    <option value = "1">Text - OneOption - Info</option>
    <option value = "2">Text - OneOption - Info</option>
    </select>
    </div>
    
    <div id = "selectbox2" style="display:none">
    
    <select name = "sel2" id = "sel2" style="width:200px">
    <option value = "0">Text - AnotherOption - Info</option>
    <option value = "1">Text - AnotherOption - Info</option>
    <option value = "2">Text - AnotherOption - Info</option>
    </select>
    </div>
    
    <div id = "selectbox3" style="display:none">
    
    <select name = "sel3" id = "sel3" style="width:200px">
    <option value = "0">Text - YetAnotherOption - Info</option>
    <option value = "1">Text - YetAnotherOption - Info</option>
    <option value = "2">Text - YetAnotherOption - Info</option>
    </select>
    </div>
    
    
    </body>
    </html>
    Last edited by Philip M; 09-02-2009 at 08:20 PM. Reason: Improved

  • #5
    New Coder
    Join Date
    Jan 2009
    Posts
    41
    Thanks
    8
    Thanked 0 Times in 0 Posts
    Appreciate the suggestion but that can't work for what I'm doing unfortunately. The biggest problem I'm having is creating a solution based on the system we're using. A single drop-down is generated and needs to be sorted on page load.

    Hmm..


  •  

    Posting Permissions

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