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 2 of 2

Thread: drop down form

  1. #1
    New to the CF scene
    Join Date
    Jun 2009
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    drop down form

    Hi

    Very new to javascript. Cannot get past this problem and will be grateful for some help on what I know is simple for an experienced js person.

    Here is my code. I want the page to refresh when a new option is selected and the function called Results(xxx) to return xxx as the option selected from the form.

    <td>
    <script type="text/javascript">
    <!--
    passvar=getValues();
    Results(passvar);

    // -->
    </script>

    </td>
    </tr>
    </table>

    <FORM name="FormDropDown">
    <SELECT name="SelectGrade" onChange="document.location.reload (true)">>
    <OPTION value="Womens">Womens</option>
    <OPTION value="U17">Under 17s</option>
    <OPTION value="First Grade">First Grade</option>
    <OPTION value="Womens">Womens</option>
    </SELECT>
    </FORM>

    </body>
    </html>

    Here is my script:

    function getvalues(){
    var dd = document.getElementById('FormDropDown');
    getvalues = dd.options[dd.selectedIndex].text;
    }

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,035
    Thanks
    203
    Thanked 2,539 Times in 2,517 Posts
    function getvalues(){
    var dd = document.getElementById('FormDropDown');
    getvalues = dd.options[dd.selectedIndex].text;
    }

    You are using the same name for a function and a variable.
    And you are using document.getElementById('FormDropDown'); although the form has only a name, not an id.


    Try this:-

    Code:
    <FORM name="FormDropDown"> 
    <SELECT name="SelectGrade" onChange="getvalues(this); document.location.reload (true)">>
    <OPTION value="Womens">Womens</option>
    <OPTION value="U17">Under 17s</option>
    <OPTION value="First Grade">First Grade</option>
    <OPTION value="Womens">Womens</option>   :confused::confused:
    </SELECT> 
    </FORM> 
    
    <script type = "text/javascript">
    var gv;  // gv is declared here as a global variable available for use in other functions.
    function getvalues(which) {
    gv = which.options[which.selectedIndex].text;
    alert (gv);
    } 
    
    </script>

    For some reason you have Womens in the option list twice.
    Note that as you are using onchange() you will need to add something like
    <option value = "">-Make a selection-</option>
    as otherwise Womens will not trigger the script.

    Why are you capturing the option text rather than the value?
    Last edited by Philip M; 06-19-2009 at 05:43 PM. Reason: typo/spelling


  •  

    Posting Permissions

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