JavaScript function 从外部呼叫时响应。 但不是从 ajax 的成功部分内部。 如何解决这个问题？

Question

我使用 AJAX 调用检索了数据，并且数据作为数组成功接收。 但不能用它们来绘制图表。 When I tried to find the problem, I saw that when I call to the javascript function from the outside, it will respond and draw the chart but when I call it from the inside of the success part of AJAX, it will call to function but图表不会绘制。 甚至没有通过错误。 （我使用临时数据来检查这个问题，而不是从 AJAX 调用 [Var xData, Var yData] 中检索数据。

这是样本数据。

            var xData = [
            { x: new Date(2020,11,11), y: 35.939 },
            { x: new Date(2020,11,12), y: 40.896 },
            { x: new Date(2020,11,15), y: null }
            ];

            var yData = [
            { x: new Date(2020,11,11), y: 10 },
            { x: new Date(2020,11,12), y: 45.896 },
            { x: new Date(2020,11,13), y: null }
            ];

当我这样打电话时，它不会响应。

function showDailySales() 
            {
                var From = document.getElementById("dailySalesFrom").value;
                var To = document.getElementById("dailySaleTo").value;
                var select = document.getElementById('slctAllNamesForDaily');
                var selectedItemID = select.options[select.selectedIndex].value;

                $.ajax({
                    type: 'post',
                    url: 'controll/ReportController.php', 
                    data: {
                        showDailySales : 1,
                        From : From,
                        To : To,
                        selectedItemID : selectedItemID,
                    },
                    success: function (response) 
                    {
                        if (response) {
                            viewPoint();  // <- This call to function, but not draw the chart
                        }
                    }
                });
            }

当我用上述数据这样调用时，它会绘制图表。

                function drawChart(){                
                var arr = new Array;
                var chartLocationID = "chartContainerSales";
                var chartTopic = "Chart Topic";
                var xAxisTitle = "Date";
                var yAxixTitle = "Qty";

                arr.push(createData(xData, 'Apple'));
                arr.push(createData(yData, 'Orange'));
                
                chartShow(chartTopic, xAxisTitle, yAxixTitle, chartLocationID, arr);
            }

            function createData(getData, Name){
                var j = {
                    type:"line",
                    axisYType: "primary",
                    name: Name,
                    showInLegend: true,
                    markerSize: 0,
                    connectNullData: true,
                    xValueType: "number",
                    lineThickness: 3,
                    dataPoints: getData,                
                };
                return j;
            }

            function chartShow(chartTopic, xAxisTitle, yAxixTitle, chartLocationID, arr){

                var chartLocationID = chartLocationID;    
      
                // alert("Function called");

                window.onload = function() {
                    var chart = new CanvasJS.Chart(chartLocationID, {
                        animationEnabled: true,
                        title: {
                            text: chartTopic
                        },
                        axisX: {
                            title: xAxisTitle,                      
                            valueFormatString: "YYYY-MMM-D",
                            interval:1,
                            intervalType: "day"
                        },
                        axisY: {
                            title: yAxixTitle,
                            // minimum: 0,
                            suffix: "",
                            includeZero: true
                        },
                        legend: {
                            cursor: "pointer",
                            verticalAlign: "bottom",
                            horizontalAlign: "center",
                            dockInsidePlotArea: true,
                        },
                        data:arr 
                    });
                    chart.render();
                }
            }

            drawChart(); // <- This way call to function, and draw the chart

我尝试了很多方法，但它不起作用。 我该如何解决？

.

Answer 1

更改了以下代码..

      function chartShow(chartTopic, xAxisTitle, yAxixTitle, chartLocationID, arr){
            var chartLocationID = chartLocationID;    
            // alert("Function called");
            window.onload = function() { //something }
      }

至：

      function chartShow(chartTopic, xAxisTitle, yAxixTitle, chartLocationID, arr){
            var chartLocationID = chartLocationID;    
            // alert("Function called");
            show();
            function show() { //something }
      }

根据第一条评论。 那行得通。