Question

我对任何类型的网络开发都是全新的，我尝试使用前一个下拉列表中的值作为我的参数来填充下拉列表，但我的第二个下拉列表拒绝填充。我没有看到Xampp发生任何错误（错误检查已打开），所以我真的不确定发生了什么。这是我的代码。

    <?php
session_start();
require_once 'config.php';


if(!isset($_SESSION['user'])) {
    // user is not logged in, do something like redirect to login.php
    header("Location: index.php");
    die();
}

$page_title = "SSI-Portal";
$page_description = "Description of this page";

$userid = $_SESSION['user'];
$q= $conn->query("SELECT permissions FROM logins WHERE name='$userid'");
$perm = $q->fetchColumn();

$q= $conn->query("SELECT dept_id FROM logins WHERE name='$userid'");
$dept = $q->fetchColumn();

$_SESSION['perm'] = $perm;

include 'header.php';

    $rows = array();
    if(isset($_POST['jobtype'])) {
  $tsql = "SELECT [job number] FROM job_view WHERE completed = 0 and jobtype=?";
    $getResults = $conn->prepare( $tsql);
    $getResults->execute(array($_GET['jobtype']));
    $rows = $getResults->fetchAll(PDO::FETCH_ASSOC);;
    }
    echo json_encode($rows);
?>
<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Time</title>
        <meta charset="utf-8">
            <link rel="stylesheet" href="css/bootstrap.css?version=62">
                <link rel="stylesheet" href="css/normalize.css">
                    <link rel="stylesheet" href="css/main.css?version=52">
                        <link rel="stylesheet" href="css/mobile.css?version=51">
                            <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/css/bootstrap-select.min.css">
                                <script src="js/main.js"></script>
                                <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                                <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
                                <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/js/bootstrap-select.min.js"></script>
                            </head>
                            <body>
                                <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModalNorm">
                                    Add New Time
                                </button>

                                <!-- Modal -->
                                <div class="modal fade" id="myModalNorm" tabindex="-1" role="dialog" 
                                        aria-labelledby="myModalLabel" aria-hidden="true">
                                    <div class="modal-dialog modal-lg">
                                        <div class="modal-content">
                                            <!-- Modal Header -->
                                            <div class="modal-header">
                                                <button type="button" class="close" 
                                                        data-dismiss="modal">
                                                    <span aria-hidden="true">&times;</span>
                                                    <span class="sr-only">Close</span>
                                                </button>
                                                <h4 class="modal-title" id="myModalLabel">
                                                    New Time
                                                </h4>
                                            </div>

                                            <!-- Modal Body -->
                                            <div class="modal-body">

                                                <form role="form">
                                                    <div class="form-group">
                                                        <label>Job Type :</label>
                                                        <select class="selectpicker" data-style="btn-primary" data-width="75px" name="job" id="jobType">
                                                            <option>SVC</option>
                                                        </select>
                                                        <select class="selectpicker" data-style="btn-primary" data-width="75px">
                                                            <select name="numbers" id="jobumbers">
                                                            </select>
                                                            <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
                                                            <script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.7.5/js/bootstrap-select.min.js"></script>
                                                            <script type="text/javascript">
                                                                $(document).ready(function() {
                                                                $('.selectpicker').selectpicker();
                                                                });
                                                                function populateJobNumbers() {

                                                                $.getJSON('./time.php', {jobType:$('#jobType').val()}, function(data) {

                                                                var select = $('#jobNumbers');
                                                                var options = select.prop('options');
                                                                $('option', select).remove();

                                                                $.each(data, function(index, array) {
                                                                options[options.length] = new Option(array['numbers']);
                                                                });

                                                                });

                                                                }

                                                                $(document).ready(function() {

                                                                populateJobNumbers();
                                                                $('#jobtype').change(function() {
                                                                populateJobNumbers();
                                                                });

                                                                });
                                                            </script>
                                                            <button type="submit" class="btn btn-default">Submit</button>
                                                        </form>

                                                        <!-- Modal Footer -->
                                                        <div class="modal-footer">
                                                            <button type="button" class="btn btn-default"
                                                                    data-dismiss="modal">
                                                                Close
                                                            </button>
                                                            <button type="button" class="btn btn-primary">
                                                                Save changes
                                                            </button>
                                                        </div>
                                                    </div>
                                                </body>
                                            </html>

就像我说的那样，这是我第一次这样做，所以请放轻松我。谢谢！

Answer 1

首先，您有一个标记<select class="selectpicker" data-style="btn-primary" data-width="75px">缺少关闭标记</select>。也许你错了。

其次，你尝试重用相同的php页面来获取ajax数据并显示HTML，这取决于$ GET，这不是一个好习惯，但我们可以保留这个以后的未来。

我认为echo json_encode($rows);后面必须跟exit;行（它取代已弃用的词die()。所以你的代码会想...

if(isset($_POST['jobtype'])) {
    $tsql = "SELECT [job number] FROM job_view WHERE completed = 0 and jobtype=?";
    $getResults = $conn->prepare( $tsql);
    $getResults->execute(array($_GET['jobtype']));
    $rows = $getResults->fetchAll(PDO::FETCH_ASSOC);

    echo json_encode($rows); //this line WITHIN the IF block
    exit; //this line WITHIN the IF block
}

最后提示：尝试正确缩进代码以便于阅读！ :)）

即：标头中的<link rel="stylesheet">和<script>必须处于同一缩进级别

使用JSON PHP SQL Server填充第二个Dropdown

1 个答案: