Отображение данных SQL с использованием Ajax и jQuery из SQL с использованием C # WebMethod в Chart.Js - PullRequest
Новая
       11

Отображение данных SQL с использованием Ajax и jQuery из SQL с использованием C # WebMethod в Chart.Js

0 голосов
/ 04 июня 2018

Я ищу для отображения двух столбцов;Описание и ApplicantSourceCount в линейчатой ​​диаграмме Chart.js с использованием веб-метода C # и приведенного ниже кода jQuery / Ajax.

Я не могу вытащить данные на график для отображения, я продолжаю получать и сообщаю об ошибке, что Uncaught ReferenceError: Описание не определено Может ли кто-нибудь помочь в том, как он долженбыть структурированным?

Я проверил несколько разных источников, но не могу заставить что-либо работать.

Пример данных SQL: 

Description   | ApplicantSourceCount
  Reed        |      48
  Indeed      |      38
  TotalJobs   |      43

Код jQuery / Ajax; 

jQuery(document).ready(function () {
            console.log( "ready!" );


        jQuery.ajax({
            type: "POST",
            url: "ReportingDashboard.aspx/GetApplicantSourceData",
            data: '{aData:' + Description + ApplicationSourceCount + '}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: OnSuccess,
            error: OnErrorCall_
        });

        function OnSuccess(reponse) {
        var aData = response.d;
        var aLabels = aData[0];
        var datasetAppSource1 = aData[1];
        var datasetAppSource2 = aData[2];

        var data = {
            labels: aLabels,
            datasets: [{
                label: "Description",
                data: datasetAppSource1,
                borderColor: "rgba(0, 123, 255, 0.9)",
                borderWidth: "0",
                backgroundColor: "rgba(0, 123, 255, 0.5)"
            },
            {
                label: "ApplicantSourceCount",
                data: datasetAppSource2,
                borderColor: "rgba(0, 123, 255, 0.9)",
                borderWidth: "0",
                backgroundColor: "rgba(0, 123, 255, 0.5)"
            }]
        };

            //bar chart
            var ctx = document.getElementById("barChart");
                ctx.height = 200;
            var barChart = new Chart(ctx).Line(date, {
                bezierCurve: false
            });
        }
        function OnErrorCall_(repo) {
            alert("Error Loading Data");
        }
    });

Веб-метод C # 

[WebMethod]
    public List<ApplicantSourceData> GetApplicantSourceData(List<string> aData)
    {
        //SqlDataReader reader;
        List<ApplicantSourceData> GetApplicantSourceData = new List<ApplicantSourceData>();

        string connectionString = ConfigurationManager.ConnectionStrings["ATL2"].ConnectionString;
        string commandTextApplicantsByMonthCount = Properties.Queries.commandTextApplicantsByMonthCount;

        using (SqlConnection con = new SqlConnection(connectionString))
        {
            using (SqlCommand command = new SqlCommand(commandTextApplicantsByMonthCount))
            {

                command.CommandText = commandTextApplicantsByMonthCount;
                command.CommandType = CommandType.Text;
                command.Connection = con;
                con.Open();
                SqlDataReader reader = command.ExecuteReader();
                if (reader.HasRows)
                {
                    int counter = 0;
                    while (reader.Read())
                    {
                        ApplicantSourceData tsData = new ApplicantSourceData();
                        tsData.Description = reader["Description"].ToString();
                        tsData.ApplicantSource = reader["ApplicantSourceCount"].ToString();
                        GetApplicantSourceData.Add(tsData);
                        counter++;
                    }
                }
            }
            return GetApplicantSourceData;
        }
    }
...