在PHP和AJAX中重復行

Question

查看成績頁面示例

因此，正如標題所暗示的，我在PHP和AJAX方面遇到了問題，這使我需要重復行。 我只想顯示總數。 單位和GPA，但對於每一個科目，它都會增加一行

AJAX：

$.ajax({
    traditional: true,
    url: "getGrades.php",
    method: "GET",
    data: {
        id: id,
        semester: semester,
        year: year
    },
    dataType: "JSON",
    success: function(data){
        $("#gradeBody").children().remove();
        $("#gradeFoot").children().remove();
        console.log(data);
        $("#gradeLoad").css("display", "block");
        for(var i = 0; i < data.length; i++){

            $("#gradeTable tbody").append('<tr class = "course"><td class = "course">'+data[i].subjectCode+'</td><td class = "course">'+data[i].subjectName+'</td>><td class = "course">'+data[i].units+'</td></td>><td class = "course">'+data[i].mg+'</td></td>><td class = "course">'+data[i].units+'</td></tr>');

            $("#gradeTable tfoot").append('<tr class = "course"><td class = "course"></td><td class = "course"></td>><td class = "course"><strong>Total No. of Units: </strong>'+data[i].un+'</td></td>><td class = "course"><strong>GPA</strong></td></td>><td class = "course">'+data[i].ave+'</td></tr>');
        }

    }

});

PHP：

[<?php
require("connect.php");
$id = $_GET\['id'\];
$year = $_GET\['year'\];
$semester = $_GET\['semester'\];
$query = "
        SELECT *, SUM(s.units) AS un, ROUND(AVG(g.fg), 2) AS ave
        FROM subjectschedule AS ss
        JOIN subject AS s 
        ON s.subjectID = ss.subjectid
        JOIN grados as g
        ON g.subjectid = s.subjectID
        WHERE g.studentid = '$id'
        AND ss.academic_year_start = '$year'
        AND ss.semester = '$semester'
        GROUP BY ss.subSchedID

        ";
$retval = mysqli_query($db, $query);
$data = array();


while($row = mysqli_fetch_assoc($retval)){
    $data\[\] = $row;
}
echo json_encode($data);

?>

我上傳的圖片顯示了當前結果，如何防止重復出現？

Answer 1

您可以簡單地通過在循環之后在末尾附加Sum和GPA來完成此操作

 $.ajax({ traditional: true, url: "getGrades.php", method: "GET", data: { id: id, semester: semester, year: year }, dataType: "JSON", success: function(data) { $("#gradeBody").children().remove(); $("#gradeFoot").children().remove(); console.log(data); $("#gradeLoad").css("display", "block"); for (var i = 0; i < data.length; i++) { $("#gradeTable tbody").append('<tr class = "course"><td class = "course">' + data[i].subjectCode + '</td><td class = "course">' + data[i].subjectName + '</td>><td class = "course">' + data[i].units + '</td></td>><td class = "course">' + data[i].mg + '</td></td>><td class = "course">' + data[i].units + '</td></tr>'); } $("#gradeTable tfoot").append('<tr class = "course"><td class = "course"></ td > < td class = "course" > < /td>><td class = "course"><strong>Total No. of Units: </strong > ' + data[0].un + ' < /td></td >> < td class = "course" > < strong > GPA < /strong></td > < /td>><td class = "course">' + data[0].ave + '</td > < /tr>'); } }); 

Answer 2

試試看。我想你需要把頁腳放在for循環之外。

$.ajax({
            traditional: true,
            url: "getGrades.php",
            method: "GET",
            data: {
                id: id,
                semester: semester,
                year: year
            },
            dataType: "JSON",
            success: function(data){
                $("#gradeBody").children().remove();
                $("#gradeFoot").children().remove();
                console.log(data);
                $("#gradeLoad").css("display", "block");
                for(var i = 0; i < data.length; i++){
                    $("#gradeTable tbody").append('<tr class = "course"><td class = "course">'+data[i].subjectCode+'</td><td class = "course">'+data[i].subjectName+'</td>><td class = "course">'+data[i].units+'</td></td>><td class = "course">'+data[i].mg+'</td></td>><td class = "course">'+data[i].units+'</td></tr>');
                }
                    $("#gradeTable tfoot").append('<tr class = "course"><td class = "course"></td><td class = "course"></td>><td class = "course"><strong>Total No. of Units: </strong>'+data[i].un+'</td></td>><td class = "course"><strong>GPA</strong></td></td>><td class = "course">'+data[i].ave+'</td></tr>');


            }

    });