当选择另一个select语句时,如何显示select语句

时间:2015-07-21 18:24:53

标签: php jquery html

所以我的" type1" select语句将选择一个问题类别,然后根据该问题,我想要一个在另一个下拉列表中处理该问题的员工的下拉列表。另外,如何使所有隐藏的select语句占用相同的空间?

这是我的代码:

<!DOCTYPE html>
<html>
    <head>
        <title>IssueReport</title>
        <script src = "../../jquery.js"></script>
        <style>
            body{
                padding:0;
                margin:0;
            }
            #box {
                padding: 5px;
                color:black;
                margin: 0 auto;
                border-style: solid;
                border-color: #0000E6;
                border-width: 2px;
                background-color: #58C6EB;
                width: 162px;
                height: 687px;
                float: left;
                border-radius: 10px;
            }
            .word{
                color: #0000E6;
            }
            .buttons{
                background-color: #CCFFFF;
                border-radius: 5px;
            }
        </style>
        <script>
            function showForm(){
                    var issue = document.getElementById("type1").value;
                    if(issue == 'Program Glitch'){
                        document.getElementById("IT1").style.display = "block";
                    }
                    $("#type1").onchange(function{
                    });
                }
            $(document).ready(function(){
                $("#sub").click(function(){
                    var user_issue = $("#issue").val();
                    var user_priority = $("#priority").val();
                    var user_type = $("#type1").val();
                    var user_author = $("#author").val();
                    $.post("BugReport.php",{issue:user_issue,priority:user_priority,type1:user_type,author:user_author},function(data){
                        $("#result").html(data);
                    });
                });
                $("#sub").click(function(){
                    document.getElementById('issue').value='';
                    $('#type1').prop('selectedIndex', 0);
                    $('#priority').prop('selectedIndex', 1);
                });
            });
        </script>
    </head>
    <body>
        <div id="box">
        <h3 class = "word" style = "margin:10px 30px 30px 30px;">Issue Report</h3>
        <div class = "word" style = "width: 100px; margin-left: auto; margin-right: auto">Type Of Issue:</div>
            <div style = " max-width: 150px; margin-left: auto; margin-right: auto; padding: 2px">
            <form action="BugReport.html" method="post">
            <select onchange = "showForm()" class = "buttons" name = "type1" id = "type1" style = 'max-width: 150px;'>
            <?php
                    $servername = "localhost";
                    $username = "user";
                    $password = "pass";
                    $database = "database";

                    $con = mysqli_connect($servername,$username,$password,$database);
                        if($con->connect_error){
                        die("Connection failed " . $con->connect_error);
                    }
                $sql1 = "select issue_name, issue_description from Issue";
                $result = mysqli_query($con,$sql1);
                while ($row = mysqli_fetch_array($result)) {
                    $issue = $row['issue_name'];
                    $des = $row['issue_description'];
                    echo "<option value = '$issue' title = '$des'>$issue</option>";
                    }
            ?>
            </select>
            </form></div>
        <form action="BugReport.html" method="post">
        <div id = "Buyers1" style = "visibility:hidden;"><select class = "buttons" name = "author" id = "Buyers" style = "margin: 0px 30px 0px 30px;">
                <?php 
                    $sql = "select first, last from Employee where department_id = '1'";
                    $result = mysqli_query($con,$sql);
                    while ($row = mysqli_fetch_array($result)) {
                        $name = $row['first'] . ' ' . $row['last'];
                        echo "<option value = '$name'>$name</option>";

                    }
                ?>
            </select></div></form>
            <div id = "Operations1" style = "visibility:hidden;"><form action="BugReport.html" method="post">
        <select class = "buttons" name = "author" id = "Operations" style = "margin: 0px 30px 0px 30px;">
                <?php 
                    $sql = "select first, last from Employee where department_id = 2";
                    $result = mysqli_query($con,$sql);
                    while ($row = mysqli_fetch_array($result)) {
                        $name = $row['first'] . ' ' . $row['last'];
                        echo "<option value = '$name'>$name</option>";

                    }
                ?>
            </select></form></div>
            <div id = "IT1" style = "display:none;"><form action="BugReport.html" method="post">
        <select onchange = "showForm()" class = "buttons" name = "author" id = "IT" style = "margin: 0px 30px 0px 30px;">
                <?php 
                    $sql = "select first, last from Employee where department_id = 3";
                    $result = mysqli_query($con,$sql);
                    while ($row = mysqli_fetch_array($result)) {
                        $name = $row['first'] . ' ' . $row['last'];
                        echo "<option value = '$name'>$name</option>";

                    }
                ?>
            </select></form></div>
            <div id = "CustomerService1" style = "visibility:hidden;"><form action="BugReport.html" method="post">
        <select class = "buttons" name = "author" id = "CustomerService" style = "margin: 0px 30px 0px 30px;">
                <?php 
                    $sql = "select first, last from Employee where department_id = 4";
                    $result = mysqli_query($con,$sql);
                    while ($row = mysqli_fetch_array($result)) {
                        $name = $row['first'] . ' ' . $row['last'];
                        echo "<option value = '$name'>$name</option>";

                    }
                ?>
            </select></form></div>
            <div id = "HR1" style = "visibility:hidden;"><form action="BugReport.html" method="post">
        <select class = "buttons" name = "author" id = "HR" style = "margin: 0px 30px 0px 30px;">
                <?php 
                    $sql = "select first, last from Employee where department_id = 5";
                    $result = mysqli_query($con,$sql);
                    while ($row = mysqli_fetch_array($result)) {
                        $name = $row['first'] . ' ' . $row['last'];
                        echo "<option value = '$name'>$name</option>";

                    }
                ?>
            </select></form></div>
            <div id = "Logistics1" style = "visibility:hidden;"><form action="BugReport.html" method="post">
        <select class = "buttons" name = "author" id = "Logistics" style = "margin: 0px 30px 0px 30px;">
                <?php 
                    $sql = "select first, last from Employee where department_id = 6";
                    $result = mysqli_query($con,$sql);
                    while ($row = mysqli_fetch_array($result)) {
                        $name = $row['first'] . ' ' . $row['last'];
                        echo "<option value = '$name'>$name</option>";

                    }
                ?>
            </select></form></div>
        <form action="BugDisplayAndReply.html" method="post">
        <label></label><br>
        <textarea style = "max-width: 156px; background-color: #F3F9FF; border-color: #0000E6;" cols="20" rows="34" name="issue" id = "issue" placeholder = "Enter Your Issue Here" "></textarea></form><br>
            <div class = "word" style = "width: 50px; margin-left: auto; margin-right: auto">Priority:</div>
            <div style = "width: 70px; margin-left: auto; margin-right: auto; padding: 2px">
            <form action="BugReport.html" method="post">
            <select class = "buttons" name = "priority" id = "priority">
                <option value = "Low">Low</option>
                <option value = "Regular" selected>Regular</option>
                <option value = "High">High</option>
                <option value = "Urgent">Urgent</option>
            </select>
            </form></div>
        <div style = "width: 50px; margin-left: auto; margin-right: auto; padding: 2px">
        <input class = "buttons" type ="submit" name = "sub" value = "Submit" id = "sub"></div>
        <div id="result"></div>
        </div>

    </body>
</html>

0 个答案:

没有答案