data in JSONRSS

7 replies

Last post Mar 22, 2017 05:07 AM by Zhi Lv - MSFT

‹ Previous Thread|Next Thread ›

Shortcuts

Capricon Use...

Member

239 Points

1074 Posts

data in JSON

Mar 20, 2017 06:47 AM|Capricon User|LINK

i try to get data in PIE

i try this

    public class Category
        {
            public string CatgType { get; set; }
            public string ProgName { get; set; }
            public int totalStudents { get; set; }
        }


[WebMethod]
        public static List<Category> StudentAnalysis()
        {
            List<Category> studentInfos = new List<Category>();
            DataSet ds = new DataSet();
            using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings[1].ConnectionString))
            {
                using (SqlCommand cmd = new SqlCommand())
                {
                    cmd.CommandText = "test";
                    cmd.CommandType = CommandType.StoredProcedure;

                    cmd.Connection = con;
                    using (SqlDataAdapter da = new SqlDataAdapter(cmd))
                    {
                        da.Fill(ds, "clai");
                    }
                }
            }
            if (ds != null)
            {
                if (ds.Tables.Count > 0)
                {
                    if (ds.Tables["clai"].Rows.Count > 0)
                    {
                        foreach (DataRow dr in ds.Tables["clai"].Rows)
                        {
                            studentInfos.Add(new Category
                            {
                                CatgType = dr["countno"].ToString(),
                                ProgName = dr["clai"].ToString(),
                                totalStudents = Convert.ToInt32(dr["countno"])
                            });
                        }
                    }
                }
            }
            return studentInfos;
        }

now how i convert this data in JSON to pass data in PIE chart

if not possible then i go with this and try this

<script type="text/javascript">
    $(document).ready(function () {
        var cat = {};
        cat.category = '';
        GetCategories();
    });
    function GetCategories() {
        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "WebForm4.aspx/StudentAnalysis",
             data: JSON.stringify(),
            dataType: "json",
            success: function (Result) {
                Result = Result.d;
                var uniqueCat = [];
                var uniqueProgName = [];

                $.map(Result, function (ele) {
                    if (uniqueCat.indexOf(ele.CatgType) == -1)
                        uniqueCat.push(ele.CatgType);
                    if (uniqueProgName.indexOf(ele.ProgName) == -1)
                        uniqueProgName.push(ele.ProgName);
                });
                var seriesData = [];
                $.each(uniqueCat,uniqueProgName, function () {
                    var series = {};
                    var CatgType = $(this)[0];
                    var progName = $(this)[1];
                    series.CatgType = CatgType;
                    series.name = progName;
                    var s = $.grep(Result, function (e) {
                         e.CatgType == CatgType;
                         e.ProgName == progName;
                        return;
                    });
                    series.data = $.map(s, function (e) { return e.totalStudents });
                    seriesData.push(series);

                });
                DreawChart(uniqueProgName,uniqueCat, seriesData);
            },
            error: function (error) {
                debugger;
                var r = error.responseText;
                var errorMessage = r.Message;
                alert(errorMessage);
                alert(r);
                alert(Error);
            }
        });
    }

    function DreawChart(series, seriesData) {
        $('#container').highcharts({          
            chart: {
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false,
                type: 'pie'
            },
            title: {
                text: 'Browser market shares January, 2015 to May, 2015'
            },
            tooltip: {
                pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
            },
            plotOptions: {
                pie: {
                    allowPointSelect: true,
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: true,
                        format: '<b>{point.name}</b>: {point.percentage:.1f} %',
                        style: {
                            color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                        }
                    }
                }
            },
            series: JSON.parse(JSON.stringify(seriesData))
        });
    }
    </script>

but this is also not working

any solution

Zhi Lv - MSF...

All-Star

45449 Points

7008 Posts

Microsoft

Re: data in JSON

Mar 21, 2017 08:38 AM|Zhi Lv - MSFT|LINK

Hi Bakhtawar Ashiq,

I think the error is caused by your $.each(), you have put 3 parameters.
Add the count should be named ‘y’.
I have modified your code, and it is worked. Please try it.
In aspx:

   <script type="text/javascript">
        $(document).ready(function () {
            var cat = {};
            cat.category = '';
            GetCategories();
        });
        
        function GetCategories() {
            $.ajax({
                type: "POST",
                url: "WebService1.asmx/StudentAnalysis",
                contentType: "application/json; charset=utf-8",
                success: function (Result) {
                    Result = Result.d;
                        DreawChart( Result);
                },
                error: function (error) {
                    debugger;
                    var r = error.responseText;
                    var errorMessage = r.Message;
                    alert(errorMessage);
                    alert(r);
                    alert(Error);
                }
            });
        }

        function DreawChart(seriesData) {
            $('#container').highcharts({
                chart: {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false,
                    type: 'pie'
                },
                title: {
                    text: 'Browser market shares January, 2015 to May, 2015'
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            format: '<b>{point.CatgType}</b>: {point.percentage:.1f}%',
                            style: {
                                color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                            }
                        }
                    }
                },
                series: [{
                    name: 'CatgType',
                    colorByPoint: true,
                    data: seriesData

                }]
            });
        }
</script>

Code behind:

public class Category
        {
            public string CatgType { get; set; }
            public string ProgName { get; set; }
            public int y { get; set; }
        }

[WebMethod]
        public  List<Category> StudentAnalysis()
        {
            List<Category> studentInfos = new List<Category>();
            DataSet ds = new DataSet();

            using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["NorthwindConnectionString1"].ConnectionString))
            {
                string query = "SELECT * FROM [Table]";
                using (SqlCommand cmd = new SqlCommand(query))
                {
                    using (SqlDataAdapter sda = new SqlDataAdapter())
                    {
                        cmd.Connection = con;
                        sda.SelectCommand = cmd;
                        sda.Fill(ds, "clai");
                    }
                }
            }
            if (ds != null)
            {
                if (ds.Tables.Count > 0)
                {
                    if (ds.Tables["clai"].Rows.Count > 0)
                    {
                        foreach (DataRow dr in ds.Tables["clai"].Rows)
                        {
                            studentInfos.Add(new Category
                            {
                                CatgType = dr["Type"].ToString(),
                                y = dr["Count"].ToString()
                            });
                        }
                    }
                }
            }
            return studentInfos;
        }

Best regards,
Dillion

MSDN Community Support
Please remember to click "Mark as Answer" the responses that resolved your issue.
If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

Capricon Use...

Member

239 Points

1074 Posts

Re: data in JSON

Mar 21, 2017 08:56 AM|Capricon User|LINK

this shows an error

An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code

An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below.

[ArgumentException: Unknown web method StudentAnalysis.

Parameter name: methodName]

   System.Web.Script.Services.WebServiceData.GetMethodData(String methodName) +261

   System.Web.Handlers.ScriptModule.OnPostAcquireRequestState(Object sender, EventArgs eventArgs) +224

   System.Web.SyncEventExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute() +92

   System.Web.HttpApplication.ExecuteStep(IExecutionStep step, Boolean&amp; completedSynchronously) +165


[ArgumentException]: Unknown web method StudentAnalysis.

Parameter name: methodName

   at System.Web.Script.Services.WebServiceData.GetMethodData(String methodName)

   at System.Web.Handlers.ScriptModule.OnPostAcquireRequestState(Object sender, EventArgs eventArgs)

   at System.Web.HttpApplication.SyncEventExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute()

   at System.Web.HttpApplication.ExecuteStep(IExecutionStep step, Boolean& completedSynchronously)

and one thing more here i

studentInfos.Add(new Category
                            {
                                CatgType = dr["Type"].ToString(),
                                y = dr["Count"].ToString()
                            });

and also i try this but shows an error

success: function (Result) {
                Result = Result.d;
                var uniqueCat = [];
                var uniqueProgName = [];
                var uniquetotal = [];

                $.map(Result, function (ele) {
                    if (uniqueCat.indexOf(ele.CatgType) == -1)
                        uniqueCat.push(ele.CatgType);
                    if (uniqueProgName.indexOf(ele.ProgName) == -1)
                        uniqueProgName.push(ele.ProgName);
                    if (uniquetotal.indexOf(ele.y) == -1)
                        uniquetotal.push(ele.y);
                });
                var seriesData = [];
                $.each(uniqueCat,uniqueProgName,uniquetotal, function () {
                    var series = {};
                    var progName = $(this)[0];
                    var CatgType = $(this)[0];
                    var y = $(this)[0];
                    series.name = progName;
                    series.type = CatgType;
                    series.y = y;
                    var s = $.grep(Result, function (e) {
                        e.ProgName == progName;
                        e.CatgType == CatgType;
                        e.y == y;
                        return;
                    });
                    series.data = $.map(s, function (e) { return e.totalStudents });
                    seriesData.push(series);

                });
               
                DreawChart(uniqueCat,uniqueProgName,uniquetotal, seriesData);

                var data = Result.d;
                DreawChart(data);
            },
            error: function (error) {
                debugger;
                var r = error.responseText;
                var errorMessage = r.Message;
                alert(errorMessage);
                alert(r);
                alert(Error);
            }
        });
    }

    function DreawChart(result) {
        $('#container').highcharts({
            chart: {
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false,
                type: 'pie'
            },
            title: {
                text: 'Browser market shares January, 2015 to May, 2015'
            },
            tooltip: {
                pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
            },
            plotOptions: {
                pie: {
                    allowPointSelect: true,
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: true,
                        format: '<b>{point.name}</b>: {point.percentage:.1f} %',
                        style: {
                            color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                        }
                    }
                }
            },
            series: [{
                name: 'Delivered amount',
                colorByPoint: true,
                data: result
            }]
            //series: JSON.parse(JSON.stringify(result))
        });
    }
    </script>

- Reply
mgebhard
All-Star

38721 Points

15899 Posts

Re: data in JSON

Mar 21, 2017 10:50 AM|mgebhard|LINK

According to the error StudentAnalysis was not found. Double check that the service AJAX URL matches the actual service URL.

If you are running the code from the Visual Studio web server, make sure the service is running before trying to call the service. Right click the asmx file and select view in browser.

Capricon Use...

Member

239 Points

1074 Posts

Re: data in JSON

Mar 21, 2017 12:05 PM|Capricon User|LINK

mgebhard

According to the error StudentAnalysis was not found. Double check that the service AJAX URL matches the actual service URL.

If you are running the code from the Visual Studio web server, make sure the service is running before trying to call the service. Right click the asmx file and select view in browser.

i have .aspx file not .asmx and secondly services running fine and studentanalysis is method but error still occured

but now i try this but this show chart like this

I try to pass data in JSON for this first i create class like this

public class Category

        {
            public string CatgType { get; set; }
            public string ProgName { get; set; }
            public int totalStudents { get; set; }
        }

and this i do this

    [WebMethod]
    public static string StudentAnalysis()
    {
        List<Category> studentInfos = new List<Category>();
        DataSet ds = new DataSet();
        using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings[1].ConnectionString))
        {
            using (SqlCommand cmd = new SqlCommand())
            {
                cmd.CommandText = "test";
                cmd.CommandType = CommandType.StoredProcedure;
                cmd.Connection = con;
                using (SqlDataAdapter da = new SqlDataAdapter(cmd))
                {
                    da.Fill(ds, "clai");
                }
            }
        }
        if (ds != null)
        {
            if (ds.Tables.Count > 0)
            {
                if (ds.Tables["clai"].Rows.Count > 0)
                {
                    foreach (DataRow dr in ds.Tables["clai"].Rows)
                    {
                        studentInfos.Add(new Category
                        {
                            CatgType = dr["clai"].ToString(),
                            ProgName = dr["countno"].ToString(),
                            totalStudents = Convert.ToInt32(dr["countno"])
                        });
                    }
                }
            }
        }
        string data = "[";
        data += studentInfos.ToList().Select(x => @"{name:""" + x.CatgType + @""",y: " + x.ProgName + "}").Aggregate((a, b) => a + "," + b);
        data += "]";

        return data;
    }

jquery

<script type="text/javascript">
    $(document).ready(function () {
        function GetCategories() {
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "WebForm4.aspx/StudentAnalysis",
                data: JSON.stringify(),
                dataType: "json",
                success: function (Result) {
                    var data = Result.d;
                    DreawChart(data);
                },
                error: function (error) {
                    debugger;
                    var r = error.responseText;
                    var errorMessage = r.Message;
                    alert(errorMessage);
                    alert(r);
                    alert(Error);
                }
            });
        }
    });

        function DreawChart(result) {
            $('#container').highcharts({
                chart: {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false,
                    type: 'pie'
                },
                title: {
                    text: 'Browser market shares January, 2015 to May, 2015'
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %',
                            style: {
                                color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                            }
                        }
                    }
                },
                series: [{
                    name: 'Delivered amount',
                    colorByPoint: true,
                    data: result
                }]
            });
        }

</script>

result.d shows

[{name:"Hms",y: 81},{name:"Lms",y: 12},{name:"Oims",y: 12}]

but chart display like this chart image means not correctly parse in pie chart

- Reply
mgebhard
All-Star

38721 Points

15899 Posts

Re: data in JSON

Mar 21, 2017 12:24 PM|mgebhard|LINK

Bakhtawar Ashiq
secondly services running fine and studentanalysis is method but error still occured

Then you are no longer receiving the error?

Place a break point in your service and step through the code. Make sure your custom JSON serialization is working properly.
- Reply
Capricon Use...
Member

239 Points

1074 Posts

Re: data in JSON

Mar 21, 2017 12:41 PM|Capricon User|LINK

yes i also post the code and graph but graph not display properly please check above code

Zhi Lv - MSF...

All-Star

45449 Points

7008 Posts

Microsoft

Re: data in JSON

Mar 22, 2017 05:07 AM|Zhi Lv - MSFT|LINK

Hi Bakhtawar Ashiq,

I think the reason is your data type is string. Please try to convert it to json.
For example:

[WebMethod]
        public  List<Category> StudentAnalysis()
        {
            List<Category> studentInfos = new List<Category>();
            DataSet ds = new DataSet();

            using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["NorthwindConnectionString1"].ConnectionString))
            {
                string query = "SELECT * FROM [Table]";
                using (SqlCommand cmd = new SqlCommand(query))
                {
                    using (SqlDataAdapter sda = new SqlDataAdapter())
                    {
                        cmd.Connection = con;
                        sda.SelectCommand = cmd;
                        sda.Fill(ds, "clai");
                    }
                }
            }
            if (ds != null)
            {
                if (ds.Tables.Count > 0)
                {
                    if (ds.Tables["clai"].Rows.Count > 0)
                    {
                        foreach (DataRow dr in ds.Tables["clai"].Rows)
                        {
                            studentInfos.Add(new Category
                            {
                                  CatgType = dr["clai"].ToString(),
                                  ProgName = dr["countno"].ToString(),
                                  totalStudents = Convert.ToInt32(dr["countno"])           
                            });
                        }
                    }
                }
            }
            string data = "[";
            data += studentInfos.ToList().Select(x => @"{name:""" + x.CatgType + @""",y: " + x.ProgName + "}").Aggregate((a, b) => a + "," + b);
            data += "]";
           return JsonConvert.DeserializeObject<List<Category>>(data);
        }

Best regards,
Dillion

‹ Previous Thread|Next Thread ›