locked
morris.js and webservice RRS feed

  • Question

  • User560206892 posted

    i have some troubles using morris.js with asp.net webservice here my js code :

     function Graph() {
            var dd = JSON.stringify({ "panum": pnum, "rubnum" : rnum });
    
            $.ajax({
                type: 'GET',
                url: "MyService.asmx/Getchartdata",
                dataType: 'json',
                async: false,
                contentType: "application/json; charset=utf-8",
                data: dd,
                success: function (result) {
                    dd = result; // also tried data.d
                },
                error: function (xhr, status, error) {
                    alert(error);
                }
            });
    
            return dd;
        }
    
    
        $(document).ready(function () {
    
            Morris.Line({
                element: 'area-example',
                data: $.parseJSON(Graph()),
                xkey: 'DAT',
                ykeys: ['VAL'],
                labels: ['VAL'],
                smooth: false
            });
        });
    </script>

    and here is my server side code 

      public class ChartPointClass
    {
        public string DAT { get; set; }
    
        public string VAL { get; set; }
    }
    
    
    [ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet = false)]
    [WebMethod(EnableSession = true)]
    public string Getchartdata(int panum, int rubnum)
    {
        string result = "";
    
        using (Entities me = ContextFactory.ObtainContext())
        {
    
    
            var q = from n in me.VISRUBs.Where(a => a.RUBNUM == rubnum && a.VISANA.VISITE.PANUM == panum)
                    .OrderBy(a => a.VISANA.VISITE.DATEVIS).ToList()
    
                    select new ChartPointClass()
                    {
                        DAT = String.Format("{0:dd/MM/yyyy}", (DateTime)n.VISANA.VISITE.DATEVIS.Value),
                        VAL = n.VALEUR
                    };
    
    
    
            JavaScriptSerializer serializer = new JavaScriptSerializer();
            result = serializer.Serialize(q.ToList());
            return result;
        }
    
    }

    i have also checked that the data returned from my web service are in this form

    <string xmlns="http://MyWebsite.net/WebServices">
    [{"DAT":"12/01/2015","VAL":"0.92"},{"DAT":"22/01/2015","VAL":"1.00"},{"DAT":"15/02/2015","VAL":"0.98"}]

    the problem is that i have an internal server error with this setup and an error in the console Uncaught TypeError: Cannot read property 'match' of undefined .

    any idea what i am missing please ?

    Monday, October 5, 2015 3:27 PM

Answers

  • User61956409 posted

    Hi issam75,

    the problem is that i have an internal server error with this setup and an error in the console Uncaught TypeError: Cannot read property 'match' of undefined .

    Firstly, do you debug your code to find the line of code that causes the error?

    Secondly, you could try to initiate morris.js in AJAX success callback function.

    function Graph() {
        var dd = JSON.stringify({ "panum": pnum, "rubnum": rnum });
    
        $.ajax({
            type: 'GET',
            url: "MyService.asmx/Getchartdata",
            dataType: 'json',
            async: false,
            contentType: "application/json; charset=utf-8",
            data: dd,
            success: function (result) {
                dd = result; // also tried data.d
                Morris.Line({
                    element: 'area-example',
                    data: dd,
                    xkey: 'DAT',
                    ykeys: ['VAL'],
                    labels: ['VAL'],
                    smooth: false
                });
            },
            error: function (xhr, status, error) {
                alert(error);
            }
        });
    
        //return dd;
    }
    
    
    $(document).ready(function () {
        Graph();
    });
    

    Best Regards,

    Fei Han

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, October 7, 2015 2:43 AM

All replies

  • User61956409 posted

    Hi issam75,

    the problem is that i have an internal server error with this setup and an error in the console Uncaught TypeError: Cannot read property 'match' of undefined .

    Firstly, do you debug your code to find the line of code that causes the error?

    Secondly, you could try to initiate morris.js in AJAX success callback function.

    function Graph() {
        var dd = JSON.stringify({ "panum": pnum, "rubnum": rnum });
    
        $.ajax({
            type: 'GET',
            url: "MyService.asmx/Getchartdata",
            dataType: 'json',
            async: false,
            contentType: "application/json; charset=utf-8",
            data: dd,
            success: function (result) {
                dd = result; // also tried data.d
                Morris.Line({
                    element: 'area-example',
                    data: dd,
                    xkey: 'DAT',
                    ykeys: ['VAL'],
                    labels: ['VAL'],
                    smooth: false
                });
            },
            error: function (xhr, status, error) {
                alert(error);
            }
        });
    
        //return dd;
    }
    
    
    $(document).ready(function () {
        Graph();
    });
    

    Best Regards,

    Fei Han

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, October 7, 2015 2:43 AM
  • User560206892 posted

    Hi Fei Han ,

    actually i have solved my problem by nitiating morris.js in the AJAX success callback function just like you suggest .

    btw in the morris.js create function there was an important parameter missing in my code

     Morris.Line({
                    element: 'area-example',
                    data: dd,
                    xkey: 'DAT',
                    ykeys: ['VAL'],
                    labels: ['VAL'],
                    smooth: false,
    parseTime: false
    
                });

    the last parameter was handling the X values as datetimes wich i don't want and it caused some errors in the clilent side .

    anyway thanks a lot .

    Wednesday, October 7, 2015 8:10 PM