简单ajax请求的jquery未定义错误

Question

我已经包含了 jquery，然后所有 ui js 文件作为少数线程表明此错误是由于依赖关系。用户上传照片时使用canvasjs绘制图形。

  Uncaught TypeError: Cannot read property 'getTime' of undefined

包含所有必需依赖项的引导 html。我认为某些循环问题或变量未正确传递，但console.log根据canvasjs的所需数据点显示有效的json。如果这些点直接嵌入到该数据点图中，则生成没有任何错误或问题。

我也尝试更新 canvasjs 的功能但不起作用，我认为这不是必需的，因为这些数据已成功传递，因此不会传递空白数据。我怀疑 for 循环是罪魁祸首，但不知道如何以及为什么

$(document).ready(function() {
    (function() {

        $('#upload-form2').ajaxForm({
            dataType: 'json',
            success: function(data) {
               var sthtml;              
                var html = '',
                    downlo;
                for (var i = 0; i < data.length; i++) {
                    z = i + 1;
                    downlo = data[i];
                    html += '<tr id="' + i + '"><td>' + z + '</td></tr>';
                sthtml += downlo.stchart;

                }

// canvas graph starts here

        var chart = new CanvasJS.Chart("chartContainer",
    {     
      theme:"theme2",
      title:{
        text: "Game of Thrones, Viewers of the first airing on HBO"
      },
      data: [
      {        
        type: "spline",        
       dataPoints: [sthtml]
// this is the culprit dont know why but console.log shows correct canvasjs.min.js:103 Uncaught TypeError: Cannot read property 'getTime' of undefined
    //         dataPoints: [{ x: 3, y: 150 },{ x: 2, y: 14}]     
 //gives no error however my console.log output is exactly same in last line of this script 
 },
      {        
        type: "spline", 
       dataPoints: [{ x: 1, y: 450 },{ x: 2, y: 414}] 
      } 
      ],
    });
chart.render();

// canvas graph ends here

//console.log(sthtml);
            }
        })
    })();
});

Answer 1

你的 sthtml 应该是数组类型。您已对 sthtml 使用串联操作，将 sthtml 转换为字符串。您需要使用数组推送操作来推送。

$(document).ready(function() {
    (function() {

        $('#upload-form2').ajaxForm({
            dataType: 'json',
            success: function(data) {
               var sthtml=[];// sthhtml is array              
                var html = '',
                    downlo;
                for (var i = 0; i < data.length; i++) {
                    z = i + 1;
                    downlo = data[i];
                    html += '<tr id="' + i + '"><td>' + z + '</td></tr>';
                sthtml.push(downlo.stchart); // use push to push objects

                }

// canvas graph starts here

        var chart = new CanvasJS.Chart("chartContainer",
    {     
      theme:"theme2",
      title:{
        text: "Game of Thrones, Viewers of the first airing on HBO"
      },
      data: [
      {        
        type: "spline",        
       dataPoints: sthtml
// this is the culprit dont know why but console.log shows correct canvasjs.min.js:103 Uncaught TypeError: Cannot read property 'getTime' of undefined
    //         dataPoints: [{ x: 3, y: 150 },{ x: 2, y: 14}]     
 //gives no error however my console.log output is exactly same in last line of this script 
 },
      {        
        type: "spline", 
       dataPoints: [{ x: 1, y: 450 },{ x: 2, y: 414}] 
      } 
      ],
    });
chart.render();

// canvas graph ends here

//console.log(sthtml);
            }
        })
    })();
});