使用AJAX，PHP和JSON從MySQL數據庫獲取數據項

Question

我一直無法啟動AJAX / PHP。 如果有人可以幫助我發現我所犯的錯誤，我將非常感激。

這是我的第一個文件的摘錄，該文件成功填充了HTML中的選擇內容：

<?php
include 'connect_db.php';
//get all period types data
$sql = "SELECT * FROM periodtypes ORDER BY period_type_id";
$result = mysqli_query($connect,$sql);
$rowCount = mysqli_num_rows($result);?>

選擇的HTML / PHP：

        <select id="period_type_id" name="period_type_id" onchange="getNewP();">
        <option value="">Select a Period Type</option>
            <?php       
                if($rowCount>0){
                    while ($row=mysqli_fetch_assoc($result)){
                        echo '<option value="'.$row['period_type_id'].'">'.
                        $row['period_type_desc'].           
                        ' </option>';                
                    }
                }else{
                    echo '<option value="">Period type not available</option>';
                }           
            ?>  
    </select>   

我希望使用以下AJAX函數更新輸入的HTML：

    <label>Start Date (Auto-generated):</label>
<input type="text" id="start_date" name="start_date" value = "" readonly>   
<br><br>
<label>End Date (Auto-generated):</label>
<input type="text" id="end_date" name="end_date" value = "" readonly>

和AJAX功能：

    function getNewP(){
        var id = $("#period_type_id").val();
        alert(id); //This fires ok
        if (id != '')
        {
            $.ajax({ 
                url: "get_period_nbrs.php",
                method:"POST",
                data: { id : id },
                dataType: "JSON",

                success: function(output) 
                {
                    $('#start_date').text(output.start_date);
                    $('#end_date').text(output.end_date);
                }
            });
        }else
        {
            alert("Please select a Period Type");
        }

}

最后，主要的PHP腳本：

<?php
include 'connect_db.php';

if (isset($_POST['id']) && !empty($_POST['id'])){
    //echo $_POST[id];
    $sql =  "SELECT SUBSTRING(MAX(period_nbr),5,2)+1 AS nxt_sfx, 
                        MAX(start_date)+ 1 as start_date, MAX(end_date)+1 AS end_date  
                            FROM periods AS p 
                            INNER JOIN periodtypes AS pt on pt.period_type_id = p.period_type_id
                            WHERE p.period_type_id = '".$_POST['id']."'";
    $result = mysqli_query($connect,$sql);

    while($row=mysqli_fetch_array($result)){
        if($result == true){
            $start_date = $row['start_date'];
            $end_date = $row['end_date'];
            $period_nbr_nxt_sfx = $row['nxt_sfx'];
            if ($period_nbr_nxt_sfx < 52 && $period_nbr_nxt_sfx != NULL){
                $output['start_date'] = $row['start_date'];
                $output['end_date'] = $row['end_date'];
                echo json_encode($output);
            }
        }
    }
}

?>

Answer 1

您沒有使用正確的方法來填寫您的輸入：

$('#start_date').text(output.start_date);
$('#end_date').text(output.end_date);

應該 ：

$('#start_date').val(output.start_date);
$('#end_date').val(output.end_date);

Answer 2

JSON需要根密鑰，請嘗試以下操作：

print_r( "{\"data\": ".json_encode($output)."}" );

代替

echo json_encode($output);