jQuery.getJSON() error: Browser Link: Failed to invoke return value callback: TypeError: Cannot read property 'files' of null

Question

I'm following @Sam Farajpour Ghamari 's answer from: How to populate google charts using data from database created via code first - ASP.Net MVC

That is my script.js

google.charts.load('current', { packages: ['corechart', 'line'] });
google.charts.setOnLoadCallback(drawLineColors);
function drawLineColors() {

    var data = new google.visualization.DataTable();

    data.addColumn('number', '@Model.Days');
    data.addColumn('number', '@Model.Time');

    console.log("!!!");
    //data.addRows([       
    //    [9, 12], [11, 14]
    //]);

    $.getJSON("http://localhost:4411/GetChart", null, function (chartData) {
        $.each(chartData, function (i, item) {
                data.addRows([[item.Days, item.Time]]);
        );


        var options = {
            title: 'You can see on chart in which time you eat',
            hAxis: {
                title: 'Days'
            },
            vAxis: {
                title: 'Time'
            },
            colors: ['#FF6B00', '#0033FF']
        };

        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
        chart.draw(data, options);
    });
}

As you can see i put "http://localhost:4411/GetChart" instead of "@Url.Action('GetChart')" because first one did not work.

And in controller i have:

[Route("/GetChart")]
        public IActionResult GetChart()
        {
            return Json(_db.database
                .Select(p =>new {p.Days, p.Time}));
        }

http://localhost:4411/GetChart in the browser returns:

[{"Days":1101,"Time":20},{"Days":1102,"Time":20},{"Days":1103,"Time":20}]

Commented hard-coded version "[9, 12], [11, 14]" worked okay, but current script.js version returns errors in browser console(F12):

Uncaught Error: Bootstrap's JavaScript requires jQuery version 1.9.1 or higher, but lower than version 3 
!!!
browserLink:64 [00:57:43 GMT+0400 (Russian Daylight Time)] Browser Link: Failed to invoke return value callback:
TypeError: Cannot read property 'files' of null

As a result I have empty diagram without data. I need help to understand where do i have problem? Maybe the problem is that script is looking for data in the format of: [[days],[time]] , but instead it gets it in the format: [{data},{time}] If it so, how can i fix it? Let me know if any additional information is needed. Thanks for your time and answers.

So you need this version of jquery in your code: cdnjs.com/libraries/jquery/1.9.1. — applecrusher
– applecrusher, Commented Jul 27, 2016 at 22:26
I have downloaded version 1.9.1 at NuGet package manager, but problem still exists. @applecrusher , do you know how to fix it? — Anela
– Anela, Commented Jul 28, 2016 at 6:38
Is there a html file to put the jquery code or a way to import the script? — applecrusher
– applecrusher, Commented Jul 28, 2016 at 6:46
What do you mean? My jquery code is above. Sorry, i don't understand you, @applecrusher . I'm using Visual Studio — Anela
– Anela, Commented Jul 28, 2016 at 8:22
Is there a page with html anywhere that is using this script? — applecrusher
– applecrusher, Commented Jul 28, 2016 at 14:06

Anela · Accepted Answer · 2016-07-28 14:46:40Z

0

Solved it myself. Really stupid mistake. I just had to change this:

data.addRows([[item.Days, item.Time]]);

to this:

data.addRows([[item.days, item.time]]);

Now I would like to understand why is it so? In my project I have named Days and Time using Capital letter.

answered Jul 28, 2016 at 14:46

Anela

291 silver badge8 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sir Devilik · Accepted Answer · 2017-01-04 20:01:27Z

0

"Now I would like to understand why is it so? In my project I have named Days and Time using Capital letter."

Are you using asp.net Core? if yes, you have to turn of the camelCase convenction thats ON by default.

answered Jan 4, 2017 at 20:01

Sir Devilik

11 bronze badge

Collectives™ on Stack Overflow

jQuery.getJSON() error: Browser Link: Failed to invoke return value callback: TypeError: Cannot read property 'files' of null

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related