hey guys,

I don't seem to understand why this code is throwing a type error at me. It is saying the variable is undefined. The error I'm getting is this

TypeError: datasplits is undefined
datasplit2s = datasplits.split(":");

var urlphp = 'ajaxgamesperday.php?&start_date=' + startDate + '&end_date=' + endDate;
                $.ajax({
                    url: urlphp,
                    success: function(data) {
                        // Original format "2000-00-00"
                        var formatted_startDate = startDate.replace(/-/g, ",");
                        var formatted_endDate = endDate.replace(/-/g, ",");
                        var startdatearray = formatted_startDate.split(",");
                        var enddatearray = formatted_endDate.split(",");
                        //Format now is "2000,00,00"
                        var sy = parseInt(startdatearray[0]);
                        var sm = parseInt(startdatearray[1],10) - 1;
                        var sd = parseInt(startdatearray[2]);
                        var ey = parseInt(enddatearray[0]);
                        var em = parseInt(enddatearray[1],10) - 1;
                        var ed = parseInt(enddatearray[2]);

                        options = {
                            chart: {
                                renderTo: 'container3',
                                type: 'bar'
                            },
                            xAxis: {
                                type: "datetime"
                            },
                            yAxis: [{
                                min: 0,
                                allowDecimals: false,
                                title: {
                                    align: 'high'
                                },
                                labels: {
                                    overflow: 'justify'
                                }
                            }],
                            tooltip: {
                                formatter: function() {
                                    return ''+
                                    Highcharts.dateFormat('%e. %b', this.x)+ ': '+ this.y + ' games played';
                                }
                            },
                            plotOptions: {
                                bar: {
                                    dataLabels: {
                                        enabled: true
                                    }
                                }
                            },
                                legend: {
                                },
                                 credits: {
                                    enabled: false
                                },
                                series: [{
                                        name: 'Complete games',
                                        data: [],
                                    },
                                    {
                                        name : 'Incomplete games',
                                        data: []
                                }]
                        };

                        dataremovebrackets = data.slice(1,-1);
                        dtsplit = dataremovebrackets.split(",");
                        $.each(dtsplit, function(date,value) {
                            var datasplit = value.split("'");
                            var datasplits = datasplit[0].slice(1);
                            var datasplit2s = datasplits.split(":");
                            var formatted_date = datasplit2s[0].replace(/-/g, ",");
                            var xval = formatted_date.split(",");
                            var x = Date.UTC(xval[0], xval[1] - 1, xval[2]);

                            if (datasplit2s[1] != 0) {
                                options.series[0].data.push([x,parseFloat(datasplit2s[1])]);
                            }

                            datasplits = datasplit[1];
                            datasplit2s = datasplits.split(":");
                            formatted_date = datasplit2s[0].replace(/-/g, ",");
                            xval = formatted_date.split(",");
                            x = Date.UTC(xval[0], xval[1] - 1, xval[2]);

                            if (datasplit2s[1].substring(0, datasplit2s[1].length - 1) != 0) {
                                options.series[1].data.push([x,parseFloat(datasplit2s[1])]);
                            }
                        });

                        chart = new Highcharts.Chart(options);
                        chart.xAxis[0].setExtremes(Date.UTC(sy,sm,sd), Date.UTC(ey, em, ed));
                        chart.setTitle({text: "Number of games played per day"}, {text: "Source: Ants Database"});
                        chart.xAxis[0].setTitle({text: "Date"});
                        chart.yAxis[0].setTitle({text: "Number of Players"});
                        },
                        cache: false
                        } , "json");

Dani AI

Generated

Good catch — that kind of TypeError almost always means the code tried to call .split on something that wasn't a string because the AJAX response didn’t contain the expected text for one (or more) items. The safest approach is to (1) inspect the raw response first, (2) add defensive checks before calling string methods, and (3) move to structured JSON parsing if possible.

A small, defensive parsing pattern you can drop into the loop:

// skip empty/malformed entries
if (!value) return;

var text = String(value).trim().replace(/^'+|'+$/g, ''); // remove surrounding quotes
var pair = text.split(':');
if (pair.length < 2) return;

var dateParts = pair[0].split('-').map(Number);
var count = parseFloat(pair[1]) || 0;

Longer-term: stop relying on ad-hoc string slicing of the server response. Have the server return real JSON (an array of objects like { "date":"YYYY-MM-DD", "complete":5, "incomplete":2 }) and set dataType: 'json' in your AJAX call or use $.getJSON. That removes brittle operations like slice(1, -1) and makes mapping to Highcharts trivial and reliable.

Quick troubleshooting checklist:

  • Log the raw response (console.log(data)) and inspect the Network tab to confirm content and HTTP status.
  • If using $.each on an array, remember the callback signature is (index, value).
  • Ensure the server returns a consistent shape (prefer empty array [] instead of an empty string).
  • Add guards before every .split and fail gracefully (skip the entry or log a warning).

These steps prevent the same TypeError in future and make the parsing robust even when the dataset is empty or partially malformed.

any idea on how to resolve the issue in the code?

The problem was that no data was being passed to the stuff in the for-each loop.This thread is solved.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.