Error: Undefined Error on binding Google Chart using Stored Procedure ASP.Net

Last Reply 9 months ago By ashraft1

Posted 9 months ago

 

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="T.aspx.cs" Inherits="T" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

      <script src="jquery.min.js" type="text/javascript"></script>
    <script src="jsapi.js" type="text/javascript"></script>

</head>
<body>
    <form id="form1" runat="server">
 
  <asp:DropDownList ID="DrpMonth" runat="server" >
    <asp:ListItem Text="Select" Value="Select" Selected="True"></asp:ListItem>
        <asp:ListItem Text="Jan" Value="1" ></asp:ListItem>
        <asp:ListItem Text="Feb" Value="2"></asp:ListItem>
      
    </asp:DropDownList>

    <asp:TextBox ID="TxtFDate" runat="server" Text="01-Nov-2017"></asp:TextBox>
    <asp:TextBox ID="TxtTDate" runat="server" Text="30-Nov-2017"></asp:TextBox>

<script type="text/javascript">

    google.load("visualization", "1", { packages: ["corechart"] });
    google.setOnLoadCallback(function () {

        $("#DrpMonth").on("change", function () {
            drawChart();
        });
    });

    function drawChart() {
        var month = $("#DrpMonth option:selected").val();
        var F = $("#TxtFDate").val();
        var T = $("#TxtTDate").val();

        $.ajax({
            type: "POST",
            url: "NewChart.aspx/GetChartData",
            data: "{month: '" + month + "' , F: '" + F + "' , T: '" + T + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (r) {
                var data = google.visualization.arrayToDataTable(r.d);
                var chart = new google.visualization.PieChart($("#chart")[0]);
                chart.draw(data, { title: month + ' Distribution', is3D: false });
            },
            failure: function (r) {
                alert(r.d);
            },
            error: function (r) {
                alert(r.d);
            }
        });
    }
</script>

<div id="chart" style="width: 900px; height: 500px;">
</div>

    </form>
</body>
</html>

 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Web.Services;
using System.Configuration;
using System.Data.SqlClient;

public partial class T : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    [WebMethod]
    public static List<object> GetChartData(string month, DateTime F, DateTime T)
    {
        String strConnString = ConfigurationManager.ConnectionStrings["Con"].ConnectionString;
        SqlConnection con = new SqlConnection(strConnString);

        List<object> chartData = new List<object>();
        chartData.Add(new object[] { "Branch", "Total" });

        SqlCommand cmd12 = new SqlCommand("BranchSel", con);
        cmd12.CommandType = CommandType.StoredProcedure;
        cmd12.Parameters.AddWithValue("@S", month);
        cmd12.Parameters.AddWithValue("@F", F);
        cmd12.Parameters.AddWithValue("@T", T);

        SqlDataAdapter da = new SqlDataAdapter(cmd12);

        using (SqlDataReader sdr = cmd12.ExecuteReader())
        {
            while (sdr.Read())
            {
                chartData.Add(new object[] { sdr["Branch"], sdr["Total"] });
            }
        }
        con.Close();
        return chartData;


    }
}

 

You are viewing reply posted by: ashraft1 9 months ago.
Posted 9 months ago

Thank you all got the solution ...

I have missed con.Open(); in Store Procedure ...