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 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Jun 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Onchange function

    MY javascript knowlege is a little well non existant so I'm flying a little blind with the help of a few tutorals. What I'm trying to do is change the visible page content depending on what option is selected from a drop down menu. Bit it doesn't seem to be working.

    Does anyone have any ideas why ?

    Javascript Code

    function showtypeinfo(){

    if(this.text=="single"){

    document.getElementById('normal').style.visibility = 'visible';
    document.getElementById('backpackers').style.visibility = 'hidden';
    document.getElementById('annual').style.visibility = 'hidden';

    } else if (this.text=="annnual"){

    document.getElementById('annual').style.visibility = 'visible';
    document.getElementById('backpackers').style.visibility = 'hidden';
    document.getElementById('single').style.visibility = 'hidden';
    document.getElementById('independent').style.visibility = 'hidden';

    } else if (this.text=="independent"){

    document.getElementById('annual').style.visibility = 'hidden';
    document.getElementById('backpackers').style.visibility = 'hidden';
    document.getElementById('single').style.visibility = 'hidden';

    } else if (this.text=="backpacker"){
    document.getElementById('backpackers').style.visibility = 'visible';
    document.getElementById('annual').style.visibility = 'visible';
    document.getElementById('single').style.visibility = 'visible';
    document.getElementById('independent').style.visibility = 'visible';

    }
    }


    HTML Code (some of it)

    <body onload="showtypeinfo();">
    <form action="workout.php" method="post">
    <table border="1">
    <tr>
    <td colspan="9">Trip Type</td>
    </tr>
    <td colspan="9">
    <select name="triptype" onchange="showtypeinfo(this.value)">
    <option value="single">Single Trip</option>
    <option value="singlew">Single Trip with Winter Sports (12.5% added)</option>
    <option value="annual">Annual Trip (upto 59 days)</option>
    <option value="annualw">Annual Trip with Winter Sports (Price doubled) (upto 59 days)</option>
    <option value="independent">Independent/ Long Stay Single Trip (More than 59 days)</option>
    <option value="independentw">Independent/ Long Stay Single Trip Winter Sports (Price doubled) (More than 59 days)</option>
    <option value="backpacker">Backpacker</option>
    </select>
    </td>
    <tr>
    <td colspan="9" id="backpacker">Destination (backpacker)</td>
    </tr>
    <tr>
    <td colspan="9" id="backpacker">
    <select name="dbp">
    <option value="europe">Europe</option>
    <option value="ausandnewzealand">Australia and New Zealand</option>
    <option value="worldwide">Worldwide </option>
    </select>
    </td>

    If you can work out whats wrong that would be soo great! it's going to make me hours otherwise and it's probably something really stupid.

  • #2
    Regular Coder
    Join Date
    Feb 2005
    Posts
    679
    Thanks
    0
    Thanked 16 Times in 15 Posts
    In your showtypeinfo() function this.text is undefined.
    To pass your arguments to the function try:
    Code:
    function showtypeinfo(txt){
    
    if(txt=="single"){
    ........
    because you have to change the select menu to get the onchange to work the selection 'single' will not be too user friendly

  • #3
    New to the CF scene
    Join Date
    Jun 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the help!

    I've fixed that problem and had another fiddle around with the script however it's still not working.

    Can you see any other problems with my code?

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,300
    Thanks
    203
    Thanked 2,561 Times in 2,539 Posts
    } else if (this.text=="annnual") { // spelling

    <option value="backpacker">Backpacker</option> // should be backpackers
    Last edited by Philip M; 07-08-2007 at 05:10 PM.


  •  

    Posting Permissions

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