How can I get a value from a select box on the same page

Question

I'm trying to use PHP and Javascript to make a category selector box. I've set it up so that the Javascript will show the steps in order of being selected, and hide after being deselected.

However, I can't figure out how to take the selected options "id" or "value" and pass it to the next line. (once the chosen id or value is passed on, the next list can load)

Here is my code, Thanks in advance for looking. And please, if I'm doing something wrong or not the right way. Let me know and/or show me the right way to do it.

<?php
include($_SERVER["DOCUMENT_ROOT"] . "/inc/header.php");
include($_SERVER["DOCUMENT_ROOT"] . "/inc/search.php");
?>

<div class="content">
<form>
    <select name="categorys" class="newcatediv" id="step1" size="3" onchange="mine(this.value)">
        <?php 

        $result_c = mysqli_query($con,"SELECT * FROM categories ORDER BY category_name ASC");

        while($row = mysqli_fetch_array($result_c))
        {
            echo '<option class="mso" id="'. $row['category_nameid'] .'"value="';
            echo $row['category_nameid'] .'">' . $row['category_name'] . '</option>';
        } 

         ?>
    </select>

    <select name="sections" class="newcatediv" id="step2" size="3" onchange="mine2(this.value)">
        <?php 

        $var_c = ????

        $result_s = mysqli_query($con,"SELECT * FROM sections WHERE category_nameid='$var_c' ORDER BY section_name ASC");

        while($row = mysqli_fetch_array($result_s))
        {
            echo '<option class="mso" id="'. $row['section_nameid'] .'"value="';
            echo $row['section_nameid'] .'">' . $row['section_name'] . '</option>';
        } 

        ?>
    </select>

    <select name="subsections" class="newcatediv" id="step3" size="3">
        <?php 

        $var_s = ????

        $result_ss = mysqli_query($con,"SELECT * FROM subsections WHERE section_nameid='$var_s' ORDER BY subsection_name ASC");

        while($row = mysqli_fetch_array($result_ss))
        {
            echo '<option class="mso" id="'. $row['subsection_nameid'] .'"value="';    
            echo $row['subsection_nameid'] .'">' . $row['subsection_name'] . '</option>';
        } 

        ?>
    </select>

</form>
</div>

<?php
include($_SERVER["DOCUMENT_ROOT"] . "/inc/footer.php");
    ?>

Answer 1

By default, the first option in a <select> is selected, so this would work:

<select name="categorys" class="newcatediv" id="step1" size="3" onchange="mine(this.value)">
    <?php 

    $result_c = mysqli_query($con,"SELECT * FROM categories ORDER BY category_name ASC");

    $var_c = null;
    while($row = mysqli_fetch_array($result_c))
    {            
        if($var_c == null) $var_c = $row['category_nameid'];
        echo '<option class="mso" id="'. $row['category_nameid'] .'"value="';
        echo $row['category_nameid'] .'">' . $row['category_name'] . '</option>';            
    } 

     ?>
</select>

<select name="sections" class="newcatediv" id="step2" size="3" onchange="mine2(this.value)">
    <?php         

    $result_s = mysqli_query($con,"SELECT * FROM sections WHERE category_nameid='$var_c' ORDER BY section_name ASC");

    $var_s = null;
    while($row = mysqli_fetch_array($result_s))
    {
        if($var_s == null) $var_s = $row['section_nameid'];
        echo '<option class="mso" id="'. $row['section_nameid'] .'"value="';
        echo $row['section_nameid'] .'">' . $row['section_name'] . '</option>';
    } 

    ?>
</select>

<select name="subsections" class="newcatediv" id="step3" size="3">
    <?php         

    $result_ss = mysqli_query($con,"SELECT * FROM subsections WHERE section_nameid='$var_s' ORDER BY subsection_name ASC");

    while($row = mysqli_fetch_array($result_ss))
    {
        echo '<option class="mso" id="'. $row['subsection_nameid'] .'"value="';    
        echo $row['subsection_nameid'] .'">' . $row['subsection_name'] . '</option>';
    } 

    ?>
</select>

Cheers

Answer 2

Hi :) You Can't Process that at the same page using Php. But you can do that with this jquery including 3 pages. First Page:

$(document).ready(function(){
$("#step1").change(function(){
    var id=$("#step1").val();

    alert(id); //shouts the value of the selected step1
    $.post("select_step2.php", {id:id}, function(data){
        $("#step2").empty();
        $("#step2").append(data);

                    $("#step2").change(function(){
                         var id2=$("#step2").val();
                         alert(id2); //shouts the value of the selected step2

                         $.post("select_step3.php", {id:id2}, function(data){
                             $("#step3").empty();
                             $("#step3").append(data);
                          });  
                   });
        });
   });
  });

The above code is for jquery where you can call each data's that depends on each step.

<?php
include($_SERVER["DOCUMENT_ROOT"] . "/inc/header.php");
include($_SERVER["DOCUMENT_ROOT"] . "/inc/search.php");
?>


<form>
 First Step: <select name="categorys" class="newcatediv" id="step1" size="3">
    <?php 

    $result_c = mysqli_query($con,"SELECT * FROM categories ORDER BY category_name ASC");

    while($row = mysqli_fetch_array($result_c))
    {
        echo '<option class="mso" id="'. $row['category_nameid'] .'"value="';
        echo $row['category_nameid'] .'">' . $row['category_name'] . '</option>';
    } 

     ?>
</select>

Second Step: <select name="sections" class="newcatediv" id="step2" size="3"></select>

Third Step: <select name="subsections" class="newcatediv" id="step3" size="3"></select>

Code for you select_step2.php:

<?php

 //Please include the connection to your database here :)

 $var_c = trim($_POST['id']);

     $section = "";
    $result_s = mysqli_query($con,"SELECT * FROM sections WHERE category_nameid='$var_c' ORDER BY section_name ASC");

    while($row = mysqli_fetch_array($result_s))
    {
        $section.="<option value='$row[section_nameid]'>$row[section_name]</option>";
    } 
    echo $section;

?>

Code for your select_step3.php:

<?php 
  //database connection here
   $var_s = trim($_POST['id']);

    $subsection= "";
    $result_ss = mysqli_query($con,"SELECT * FROM subsections WHERE section_nameid='$var_s' ORDER BY subsection_name ASC");

    while($row = mysqli_fetch_array($result_ss))
    {
        $subsection.="<option value='$row[subsection_nameid]'>$row[subsection_name]</option>";
    } 
   echo $subsection;
 ?>