这个javascript和php代码有什么问题吗?

时间:2017-02-10 06:12:14

标签: javascript php mysql web charts

我正在从数据库进行查询。但是数据库中的数据结果不正确。我的db表是 alphapdf

JAVASCRIPT CODE

//app.js
$(document).ready(function(){
    $.ajax({
        url: "http://localhost/chartjs/data.php",
        method: "GET",
        success: function(data) {
            console.log(data);
            var Gender = [];
            var jumlah = [];
            var Fakultas = [];
            var jumlah_orang = [];

            for(var i in data)
        {
            //Gender.push("Gender " + data[i].JenisKelaminID);
            if(data[i].JenisKelaminID == 1)
            {
                Gender.push("Men");
            } 
            if(data[i].JenisKelaminID == 2)
            {
                Gender.push("Women");
            }

            jumlah.push(data[i].jumlah);

            if(data[i].Fakultas == "A")
            {
                Fakultas.push("FAPERTA");
            }

            if(data[i].Fakultas == "B")
            {
                Fakultas.push("FKH");
            }

            if(data[i].Fakultas == "C")
            {
                Fakultas.push("FPIK");
            }

            if(data[i].Fakultas == "D")
            {
                Fakultas.push("FAPET");
            }

            if(data[i].Fakultas == "E")
            {
                Fakultas.push("FAHUTAN");
            }

            if(data[i].Fakultas == "F")
            {
                Fakultas.push("FATETA");
            }

            if(data[i].Fakultas == "G")
            {
                Fakultas.push("FMIPA");
            }

            if(data[i].Fakultas == "H")
            {
                Fakultas.push("FEM");
            }

            if(data[i].Fakultas == "I")
            {
                Fakultas.push("FEMA");
            }

            jumlah_orang.push(data[i].jumlah_orang);
        }
        Gender.push("Other");
        Fakultas.push("Other");
            var chartdata = {
                labels: Gender,
                datasets: [
                    {
                        label : 'Total',
                        backgroundColor: 
                        [
                            'rgba(79, 181, 59, 1)', //green for men
                            'rgba(239, 87, 196, 1)', //pink for women
                            'rgba(166, 160, 164, 1)', //grey for other
                        ],
                        borderColor: 'rgba(200, 200, 200, 0.75)',
                        hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
                        hoverBorderColor: 'rgba(200, 200, 200, 1)',
                        data: jumlah
                    }
                ]
            };

            var chartdata2 = {
                labels: Fakultas,
                datasets: [
                    {
                        label : 'Total',
                        backgroundColor: [
                            'rgba(79, 181, 59, 1)',
                            'rgba(239, 87, 196, 1)', 
                            'rgba(166, 160, 164, 1)', 
                            'rgba(96, 60, 64, 1)', 
                            'rgba(66, 16, 164, 1)', 
                            'rgba(177, 18, 74, 1)', 
                            'rgba(176, 60, 64, 1)', 
                            'rgba(186, 10, 64, 1)', 
],
                        borderColor: 'rgba(200, 200, 200, 0.75)',
                        hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
                        hoverBorderColor: 'rgba(200, 200, 200, 1)',
                        data: jumlah_orang
                    }
                ]
};

            var ctx = $("#mycanvas");
            var ctx2 = $("#mycanvas2");


            var barGraph = new Chart(ctx, {
                type: 'bar',
                data: chartdata

            });

            var barGraph2 = new Chart(ctx2, {
                type: 'bar',
                data: chartdata2

            });
        },
        error: function(data) {
            console.log(data);
        }
    });
});

PHP代码

<?php
//setting header to json
header('Content-Type: application/json');

//database
define('DB_HOST', '127.0.0.1');
define('DB_USERNAME', 'root');
define('DB_PASSWORD', '');
define('DB_NAME', 'dbintegrasi');

//get connection
$mysqli = new mysqli(DB_HOST, DB_USERNAME, DB_PASSWORD, DB_NAME);
if(!$mysqli){
    die("Connection failed: " . $mysqli->error);
}

//query to get data from the table
$query = sprintf("SELECT JenisKelaminID, COUNT(JenisKelaminID) as jumlah FROM tahunmasukmagister GROUP BY JenisKelaminID");
$query2 = sprintf("SELECT Fakultas, COUNT(Fakultas) as jumlah_orang FROM s2view GROUP BY Fakultas");

//execute query
$result = $mysqli->query($query);
$result2 = $mysqli->query($query2);

//loop through the returned data
$data = array();

foreach ($result as $row){
    $data[] = $row;
}

foreach ($result2 as $row){
    $data[] = $row;
}

//freee memory associated with result
$result->close();
$result2->close();

//close connection
$mysqli->close();

//new print the data
print json_encode($data);

“fakultas”的图表结果是这样的 enter image description here

  [1]: https://i.stack.imgur.com/AgX6h.png

正如我们所看到的,在表格中“Fakultas G”(FMIPA)是3,但在图表上结果Fakultas G是3.这些代码有什么问题?请帮我解决这个问题。三江源

2 个答案:

答案 0 :(得分:1)

尝试更改for循环内部数据解析的逻辑 -

if(typeof data[i].JenisKelaminID !== 'undefined'){

      if(data[i].JenisKelaminID == 1)
        {
            Gender.push("Men");
        } 
        if(data[i].JenisKelaminID == 2)
        {
            Gender.push("Women");
        }

        jumlah.push(data[i].jumlah);
}

if(typeof data[i].Fakulta !== 'undefined'){

      if(data[i].Fakultas == "A")
            {
                Fakultas.push("FAPERTA");
            }

            if(data[i].Fakultas == "B")
            {
                Fakultas.push("FKH");
            }

            if(data[i].Fakultas == "C")
            {
                Fakultas.push("FPIK");
            }

            if(data[i].Fakultas == "D")
            {
                Fakultas.push("FAPET");
            }

            if(data[i].Fakultas == "E")
            {
                Fakultas.push("FAHUTAN");
            }

            if(data[i].Fakultas == "F")
            {
                Fakultas.push("FATETA");
            }

            if(data[i].Fakultas == "G")
            {
                Fakultas.push("FMIPA");
            }

            if(data[i].Fakultas == "H")
            {
                Fakultas.push("FEM");
            }

            if(data[i].Fakultas == "I")
            {
                Fakultas.push("FEMA");
            }

            jumlah_orang.push(data[i].jumlah_orang);

}

希望这会有所帮助。

答案 1 :(得分:0)

你必须在jquery中解码json数据,因为你已经在php中编码了它。