[Solved] jQuery Ajax Error: localhost says undefined in ASP.Net

sofia
 
on May 27, 2021 11:06 PM
Sample_189806.zip
4615 Views

hello,

I have got an error while making line chart. 

Error localhost says undefined

can someone help me please while resolving this issue.

my code is here

javascript Code:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
    google.load("visualization", "1", { packages: ["corechart"] });
    google.setOnLoadCallback(drawChart);
    function drawChart() {
        var options = {
            title: 'USA City Distribution',
            width: 600,
            height: 400,
            bar: { groupWidth: "95%" },
            legend: { position: "none" },
            isStacked: true
        };
        $.ajax({
            type: "POST",
            url: "Default.aspx/GetChartData",
            data: '{}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (r) {
                var data = google.visualization.arrayToDataTable(r.d);
                var chart = new google.visualization.LineChart($("#chart")[0]);
                chart.draw(data, options);
            },
            failure: function (r) {
                alert(r.d);
            },
            error: function (r) {
                alert(r.d);
            }
        });
    }
</script>
<div id="chart" style="width: 900px; height: 500px;">
</div>

C#

namespace WebApplication13
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        public static List<object> GetChartData()
        {
            string query = "SELECT [time],[average] FROM [dbo].[graph] WHERE ipaddress='192.168.15.167'";
            string constr = ConfigurationManager.ConnectionStrings["dbsc"].ConnectionString;
            List<object> chartData = new List<object>();
            chartData.Add(new object[]
            {
                "time", "average"
            });
            using (SqlConnection con = new SqlConnection(constr))
            {
                using (SqlCommand cmd = new SqlCommand(query))
                {
                    cmd.CommandType = CommandType.Text;
                    cmd.Connection = con;
                    con.Open();
                    using (SqlDataReader sdr = cmd.ExecuteReader())
                    {
                        while (sdr.Read())
                        {
                            chartData.Add(new object[]
                            {
                                sdr["time"], sdr["average"]
                            });
                        }
                    }
                    con.Close();
                    return chartData;
                }
            }
        }
    }
}

 

Download FREE API for Word, Excel and PDF in ASP.Net: Download
dharmendr
 
on May 28, 2021 01:02 AM
sofia says:
url: "Default.aspx/GetChartData",

Your aspx page name is WebForm1 but you have set it as Default.

Change with below.

url: "WebForm1.aspx/GetChartData",

 

sofia says:
 protected void Page_Load(object sender, EventArgs e)
        {
 
        }
        public static List<object> GetChartData()
        {

The WebMethod attribute is missing from GetChartData.

Refer the updated code.

Code

protected void Page_Load(object sender, EventArgs e)
{

}

[WebMethod]
public static List<object> GetChartData()
{
    string query = "SELECT [time],[average] FROM [dbo].[graph] WHERE ipaddress='192.168.15.167'";
    string constr = ConfigurationManager.ConnectionStrings["dbsc"].ConnectionString;
    List<object> chartData = new List<object>();
    chartData.Add(new object[] { "time", "average" });
    using (SqlConnection con = new SqlConnection(constr))
    {
        using (SqlCommand cmd = new SqlCommand(query))
        {
            cmd.CommandType = CommandType.Text;
            cmd.Connection = con;
            con.Open();
            using (SqlDataReader sdr = cmd.ExecuteReader())
            {
                while (sdr.Read())
                {
                    chartData.Add(new object[] { sdr["time"], sdr["average"] });
                }
            }
            con.Close();
            return chartData;
        }
    }
}

JavaScript

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
    google.load("visualization", "1", { packages: ["corechart"] });
    google.setOnLoadCallback(drawChart);
    function drawChart() {
        var options = {
            title: 'USA City Distribution',
            width: 600,
            height: 400,
            bar: { groupWidth: "95%" },
            legend: { position: "none" },
            isStacked: true
        };
        $.ajax({
            type: "POST",
            url: "WebForm1.aspx/GetChartData",
            data: '{}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (r) {
                var data = google.visualization.arrayToDataTable(r.d);
                var chart = new google.visualization.LineChart($("#chart")[0]);
                chart.draw(data, options);
            },
            failure: function (r) {
                alert(r.responseText);
            },
            error: function (r) {
                alert(r.responseText);
            }
        });
    }
</script>
<div id="chart" style="width: 900px; height: 500px;"></div>