How to pass a php variable from a dropdown to anot

2019-08-08 19:36发布

问题:

<body>

    <div id="wrapper">

        <!-- Navigation -->
       <nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="index.php">Student Scheduling System</a>
            </div>
            <!-- /.navbar-header -->

            <div class="navbar-default sidebar" role="navigation">
                <div class="sidebar-nav navbar-collapse">
                    <ul class="nav" id="side-menu">

                        <li>
                            <a href="index.php"><i class="fa fa-home fa-fw"></i> Home</a>
                        </li>
                        <li>
                            <a href="student.php"><i class="fa fa-users fa-fw"></i> Student</a>
                        </li>
                        <li>
                            <a href="coourses.php"><i class="fa fa-university fa-fw"></i> Courses</a>
                        </li>
                        <li>
                            <a href="subject.php"><i class="fa fa-archive fa-fw"></i> Subjects</a>
                        </li>

                    </ul>
                </div>
                <!-- /.sidebar-collapse -->
            </div>
            <!-- /.navbar-static-side -->
        </nav>

        <!-- Page Content -->
        <div id="page-wrapper">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-12">
                        <h3 class="page-header">Student</h3>
                        <div class="panel panel-primary">
                        <div class="panel-heading">
                            Student List
                        </div>
                        <!-- /.panel-heading -->
                        <div class="panel-body">
                            <div class="table-responsive">
                                <table  class="table table-striped table-hover" id="dataTables-example">
                                    <thead>
                                        <tr>
                                            <th>Student ID</th>
                                            <th>First Name</th>
                                            <th>Last Name</th>
                                            <th>Course</th>
                                            <th>Year</th>
                                            <th>Section</th>
                                            <th>Section ID</th>
                                        </tr>
                                    </thead>
                                    <tbody>


                         <?php
                            // Five steps to PHP database connections:

                            // 1. Create a database connection
                            //      (Use your own servername, username and password if they are different.)
                            //      $connection allows us to keep refering to this connection after it is established
                            $connection = mysql_connect("localhost","root",""); 
                            if (!$connection) {
                                die("Database connection failed: " . mysql_error());
                            }

                            // 2. Select a database to use 
                            $db_select = mysql_select_db("studsystem",$connection);
                            if (!$db_select) {
                                die("Database selection failed: " . mysql_error());
                            }

                        ?>

                        <?php
                        $result = mysql_query("Select tbl_course.studno, tbl_course.studfname, tbl_course.studlname, 
                            tbl_coursetype.course_desc, tblyear.YearName, tblset.setname, tblset.ID
                            from tbl_course, tbl_coursetype, tblyear, tblset 
                            where tbl_coursetype.course_no=tbl_course.studcourse 
                            AND tblyear.ID=tbl_course.studyear 
                            AND tblset.ID=tbl_course.studset", $connection);

                            if (!$result) {
                                die("Database query failed: " . mysql_error());
                            }

                            // 4. Use returned data
                            while ($row = mysql_fetch_array($result)) {
                                        echo "<tr class=\"success\">";
                                            echo "<td>".$row[0]."</td>";
                                            echo "<td>".$row[1]."</td>";
                                            echo "<td>".$row[2]."</td>";
                                            echo "<td>".$row[3]."</td>";
                                            echo "<td>".$row[4]."</td>";
                                            echo "<td>".$row[5]."</td>";
                                            echo "<td>".$row[6]."</td>";
                                            echo "<td><a href=\"viewsubject.php?cours={$row[3]}&year={$row[4]}&set={$row[5]}&section={$row[6]}\" class=\"btn btn-info btn-xs\">View Subject</a></td>";
                                            echo "<td><a href=\"update_stud.php?studno={$row[0]}&studfname={$row[1]}&studlname={$row[2]}&studcourse={$row[3]}\"><i class=\"fa fa-edit\"></i></a></td>";
                                            echo "<td><a href=\"delete_stud.php?studno={$row[0]}\"><i class=\"fa fa-trash-o\"></i></a></td>";
                                        echo "</tr>";

                            }

                            ?>

                            <?php
                            mysql_close($connection);
                            ?>


                                     </tbody>
                                </table>


                            </div>
                            <!-- /.table-responsive -->
                        </div>
                        <!-- /.panel-body -->

                    </div>

                        <!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">
  Add Student
</button>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Add new student</h4>


      </div>
      <div class="modal-body">

        <form role="form" action="save_stud.php" method="post">
            <div class="form-group">
            <label>First Name</label>
            <input type="text" name="studfname" class="form-control" required>
            </div>
            <div class="form-group">
            <label>Last Name</label>
            <input type="text" name="studlname" class="form-control" required>
            </div>


            <div class="form-group">
            <label>Student Course</label> 
            <select name="studcourse" class="form-control">
                      <?php

                            // Five steps to PHP database connections:

                            // 1. Create a database connection
                            //      (Use your own servername, username and password if they are different.)
                            //      $connection allows us to keep refering to this connection after it is established
                            $connection = mysql_connect("localhost","root",""); 
                            if (!$connection) {
                                die("Database connection failed: " . mysql_error());
                            }

                            // 2. Select a database to use 
                            $db_select = mysql_select_db("studsystem",$connection);
                            if (!$db_select) {
                                die("Database selection failed: " . mysql_error());
                            }

                        ?>

                <?php
                    $result = mysql_query("Select setcours, course_desc 
                        from tblset, tbl_coursetype 
                        where tbl_coursetype.course_no=tblset.setcours 
                        group by setcours", $connection);

                        if (!$result) {
                        die("Database query failed: " . mysql_error());
                        }


                      // 4. Use returned data
                            while ($row = mysql_fetch_array($result)) {  
                                echo "<option value=\"{$row[0]}\">{$row[1]}</option>";  

                            }

                ?>

            </select> 
            </div>


            <div class="form-group">
            <label>Student Year</label> 
            <select name="studyear" class="form-control">

                      <?php
                            // Five steps to PHP database connections:

                            // 1. Create a database connection
                            //      (Use your own servername, username and password if they are different.)
                            //      $connection allows us to keep refering to this connection after it is established
                            $connection = mysql_connect("localhost","root",""); 
                            if (!$connection) {
                                die("Database connection failed: " . mysql_error());
                            }

                            // 2. Select a database to use 
                            $db_select = mysql_select_db("studsystem",$connection);
                            if (!$db_select) {
                                die("Database selection failed: " . mysql_error());
                            }

                        ?>

                    <?php
                    $result = mysql_query("Select setyear, YearName 
                        from tblset, tblyear
                        where tblyear.ID=tblset.setyear 
                        group by setyear", $connection);

                        if (!$result) {
                        die("Database query failed: " . mysql_error());
                    }
                      // 4. Use returned data
                            while ($row = mysql_fetch_array($result)) {  
                                echo "<option value=\"{$row[0]}\">{$row[1]}</option>";  

                            }

                ?>


            </select> 
            </div>

            <div class="form-group">
            <label>Section</label> 
            <select name="studset" class="form-control">

                      <?php
                            // Five steps to PHP database connections:

                            // 1. Create a database connection
                            //      (Use your own servername, username and password if they are different.)
                            //      $connection allows us to keep refering to this connection after it is established
                            $connection = mysql_connect("localhost","root",""); 
                            if (!$connection) {
                                die("Database connection failed: " . mysql_error());
                            }

                            // 2. Select a database to use 
                            $db_select = mysql_select_db("studsystem",$connection);
                            if (!$db_select) {
                                die("Database selection failed: " . mysql_error());
                            }

                        ?>

                <?php
                    $result = mysql_query("SELECT * FROM tblset t LIMIT 0,1000", $connection);
                        if (!$result) {
                        die("Database query failed: " . mysql_error());
                    }

                      // 4. Use returned data
                            while ($row = mysql_fetch_array($result)) {  
                                echo "<option value=\"{$row[0]}\">{$row[1]}</option>";  

                            }

                ?>


            </select> 
            </div>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
         <input type="submit" value="Save Changes" class="btn btn-primary" class="form-control">
      </div>
      </form>
    </div>
  </div>
</div>
<!--Modal-->
                    <!-- /.col-lg-12 -->
                </div>
                <!-- /.row -->
            </div>
            <!-- /.container-fluid -->
        </div>
        <!-- /#page-wrapper -->

    </div>
    <!-- /#wrapper -->


</body>

-Above is the whole code. And below are the screenshots.

I am confused because BSIT has only 1st year level but when everytime I choose BSIT, the second dropdown will also appear 3rd year level, which is 3rd year is only intended for BSED. In short, I want that when everytime I choose a course, it will automatically change the second dropdown menu with its corresponding year level/s. I am sorry for this, but I just want to know if it is possible and how? Please teach me if it is okay with you. Thanks!

回答1:

Like I suggested in the comments, you can use chainedjs for this, or you can create your own function like:

$( document ).ready(function() {
    $('#select1').on("change", function(){
      var selectedClass = $(this).val(); //store the selected value
      $('#select2').val("");             //clear the second dropdown selected value

      //now loop through the 2nd dropdown, hide the unwanted options
      $('#select2 option').each(function () {
        var newValue = $(this).attr('class');
        if (selectedClass != newValue && selectedClass != "") {
            $(this).hide();  
        }
      else{$(this).show(); }
     });
    
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<select id="select1">
  <option value=""></option>
  <option value="number1">number 1</option>
  <option value="number2">number 2</option>
</select>
<select id="select2">
  <option class=""></option>
  <option class="number1">number 1.1</option>
  <option class="number2">number 2.1</option>
  <option class="number1">number 1.2</option>
  <option class="number2">number 2.3</option>
  <option class="number1">number 1.3</option>
  <option class="number1">number 1.2</option>
</select>