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
    Jan 2013
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Three tier select dropdown not pulling data from last tier correctly

    Hi everyone. So I have this script I've been editing for awhile and I thought I was done until I came into this problem. It was a two tier select drop down until I made it into a 2 tier. The first tier pulls all from "tier_one" and then shows options for "tier_two" in the 2nd drop down. The third "tier_three" just echos the last values.

    The problem: The last value "tier_three" is not following the chain (I might be the one who messed this one ha) but I need help to correct this

    Here is a picture of my website and the MySQL and how it is pulling data.





    And here is the function file:

    PHP Code:
    <?php
    //**************************************
    //     Page load dropdown results     //
    //**************************************
    function getTierOne()
    {
        
    $result mysql_query("SELECT DISTINCT tier_one FROM three_drops ORDER BY tier_one ASC"
        or die(
    mysql_error());

          while(
    $tier mysql_fetch_array$result )) 
      
            {
               echo 
    '<option value="'.$tier['tier_one'].'">'.$tier['tier_one'].'</option>';
            }

    }

    //**************************************
    //     First selection results     //
    //**************************************
    if ( isset($_GET['func']) && ($_GET['func'] == "drop_1") ) { 
        
    drop_1($_GET['drop_var']); 
    }


    function 
    drop_1($drop_var)
    {  
        include_once(
    'db.php');
        
    $result mysql_query("SELECT DISTINCT tier_two FROM three_drops WHERE tier_one='$drop_var'"
        or die(
    mysql_error());
        
        echo 
    '<select name="drop_2" id="drop_2">
              <option value=" " disabled="disabled" selected="selected">Choose one</option>'
    ;

               while(
    $drop_2 mysql_fetch_array$result )) 
                {
                  echo 
    '<option value="'.$drop_2['tier_two'].'">'.$drop_2['tier_two'].'</option>';
                }
        
        echo 
    '</select>';
        echo 
    "<script type=\"text/javascript\">
    $('#wait_2').hide();
        $('#drop_2').change(function(){
          $('#wait_2').show();
          $('#result_2').hide();
          $.get(\"func.php\", {
            func: \"drop_2\",
            drop_var: $('#drop_2').val()
          }, function(response){
            $('#result_2').fadeOut();
            setTimeout(\"finishAjax_tier_three('result_2', '\"+escape(response)+\"')\", 400);
          });
            return false;
        });
    </script>"
    ;
    }


    //**************************************
    //     Second selection results     //
    //**************************************
    if ( isset($_GET['func']) && ($_GET['func'] == "drop_2") ) { 
        
    drop_2($_GET['drop_var']); 
    }


    function 
    drop_2($drop_var)
    {  
        include_once(
    'db.php');
        
    $result mysql_query("SELECT * FROM three_drops WHERE tier_two='$drop_var'"
        or die(
    mysql_error());
        

               while(
    $drop_3 mysql_fetch_array$result )) 
                {
                echo 
    $drop_3['tier_three'];
                }
        
        echo 
    '</select> ';
    }
    ?>
    Here is the index file

    PHP Code:
    <?php 
      
    include('db.php');
      include(
    'func.php');
    ?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <link rel="stylesheet" type="text/css" href="mystyle.css">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Chained Select Boxes using PHP, MySQL and jQuery</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        $('#wait_1').hide();
        $('#drop_1').change(function(){
          $('#wait_1').show();
          $('#result_1').hide();
          $.get("func.php", {
            func: "drop_1",
            drop_var: $('#drop_1').val()
          }, function(response){
            $('#result_1').fadeOut();
            setTimeout("finishAjax('result_1', '"+escape(response)+"')", 400);
          });
            return false;
        });
    });

    function finishAjax(id, response) {
      $('#wait_1').hide();
      $('#'+id).html(unescape(response));
      $('#'+id).fadeIn();
    }
    function finishAjax_tier_three(id, response) {
      $('#wait_2').hide();
      $('#'+id).html(unescape(response));
      $('#'+id).fadeIn();
    }
    </script>
    </head>
    <div id="container">
    <body>

    <div id="menuContainer">
            <ul id="menu">
                <li id="home" class="first"><a href="index.php"><b>Home</b></a></li>
                <li id="single"><a href="about.php"><b>About</b></a></li>
                <li id="dropline"><a href="contest.php"><b>Contests</b></a></li>
                <li id="dropdown"><a href="email.php"><b>Contact Us</b></a></li>
                
            </ul>
        </div>




    <div id="leftpic">
    <img src="images/turret4.png"> 
    </div>
    <div id="box-container">

    <div align="center">
    <p>
    <h1>Pick a Champion</h1>


    <div class="styled-select">
        <select name="drop_1" id="drop_1">
        
          <option value="" selected="selected" disabled="disabled">Select a Category</option>
          
          <?php getTierOne(); ?>
     
     
        </select> 
     
        
        </div>
        <span id="wait_1" style="display: none;">
        <img alt="Please Wait" src="ajax-loader.gif"/>
        </span>
        </br>
        <h1>Vs</h1>
        </br><div class="styled-select">
        <span id="result_1" style="display: none;"></span>
        <span id="wait_2" style="display: none;">
        <img alt="Please Wait" src="ajax-loader.gif"/>
        </span>
        </div>
        </br>
        </br>
        <span id="result_2" style="display: none;"></span> 


    </p>
    </div>
    </div>
    <div id="rightpic">
    <img src="images/turret3.png"> 
    </div>

    <div id="footer">
    If you have advice you would like to be posted under a champion
    <a href="email.php">click here</a> </div>
    </div>
    </body>
    </html>
    Last edited by pizzaman1123; 01-09-2013 at 02:14 AM.

  • #2
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts
    I can post the index file too if anyone wants to see it.

  • #3
    God Emperor Fou-Lu's Avatar
    Join Date
    Sep 2002
    Location
    Saskatoon, Saskatchewan
    Posts
    16,979
    Thanks
    4
    Thanked 2,659 Times in 2,628 Posts
    Yep post the index file as well as any required supporting files for the forms or where its submitted to.
    How it sounds to me atm and with the code you have I'm leaning towards a issue with your AJAX, but we can't tell that without looking at it directly.
    Make sure you post it in [php][/php] tags as well to preserve the formatting.

  • Users who have thanked Fou-Lu for this post:

    pizzaman1123 (01-09-2013)

  • #4
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Fou-Lu View Post
    Yep post the index file as well as any required supporting files for the forms or where its submitted to.
    How it sounds to me atm and with the code you have I'm leaning towards a issue with your AJAX, but we can't tell that without looking at it directly.
    Make sure you post it in [php][/php] tags as well to preserve the formatting.
    Oke done. I've posted the index file too. Thanks


  •  

    Posting Permissions

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