onClickは2回のクリックで結果を入力しますHighCharts

Question

問題は、ボタンを2回クリックして目的の結果を入力しなければならないことを中心に行われます。私はHighChartsを使ってグラフを描画していますが、updateTime3Period()関数を2回呼び出す必要があります。以下は、ほとんどすべての点でupdateTime3Period()と同じであるため、updateTime6Period()関数を除いて、すべてのコードを含めました。両方とも同じ問題があります。ボタンを一度クリックさせてから、目的のチャートを作成したいと思います。私は長い投稿をお詫び申し上げます。前もって感謝します！注：これは、updateTime3Period()を2回クリックすると機能します。

HTML：updateTime3Periodため

<div id="timelinePeriods"> 
    <ul class="timeSelection"> 
     <li><a href="#" onclick="updateTime6Period();" > Past 6 Periods</a></li> 
     <li><a href="#" onclick="updateTime3Period();"> Past 3 Periods</a></li> 
    </ul> 
</div> 

JS/AJAX：上と呼ばれている

function updateTime3Period() { 
    timeFrameUpdate = 'Past 3 Periods'; 
    displayParam(); 

    $.ajax({ 
     url: 'PHP/getValues.php', 
     type: 'post', 
     data: { 
      type: "A", 
      type2: B, 
      type3: C, 
      type4: D, 
      type5: E, 
      type6: F, 
      type7: "getChartCurr" 
     }, 

     success: function(response2) { 
      obj2 = JSON.parse(response2); 

     } 

    }); 

    $.ajax({ 
     url: 'PHP/getValues.php', 
     type: 'post', 
     data: { 
      type: "A", 
      type2: B, 
      type3: C, 
      type4: D, 
      type5: E, 
      type6: F, 
      type7: "getChartPrev" 
     }, 

     success: function(response3) { 
      obj3 = JSON.parse(response3); 

     } 

    }); 

    updateCharts(obj2, obj3, measureUpdate); 
} 

機能（同じファイル）：

function displayParam() { 
    document.getElementById("params").innerHTML = timeFrameUpdate; 
} 

function updateCharts(data1, data2, measureData) { 

} else if (timeFrameUpdate == 'Past 6 Periods') { 
    updateSixMonthPeriodChart(data1, data2, measureData); 
} else if (timeFrameUpdate == 'Past 3 Periods') { 
    updateThreeMonthPeriodChart(data1, data2, measureData); 
} 

HighChartsグラフは：

function updateThreeMonthPeriodChart(data1, data2, measureData) { 

    var measureValue = data1["graph"]; 
    var measureValuePrev = data2["graphPrev"]; 
    var changeValue = new Array(); 

    for (i = 0; i < 3; i++) { 
     measureValue[i] = parseInt(measureValue[i]); 
     changeValue[i] = (parseInt(measureValue[i]) - parseInt(measureValuePrev[i]))/parseInt(measureValuePrev[i]) 
    } 
    var chart1; // globally available 
    $(document).ready(function() { 
     chart1 = new Highcharts.Chart({ 
      chart: { 
       renderTo: 'myChart', 
      }, 
      title: { 
       text: 'Sales and Percent Change vs. Last Year - Past 3 Periods' 
      }, 
      xAxis: { 
       categories: [1, 2, 3], 
       title: { 
        text: 'Period' 
       }, 
      }, 
      yAxis: [{ 
       labels: { //Right y-axis 
        formatter: function() { 
         return Highcharts.numberFormat(this.value, 1, '.', ',') + '%'; 
        } 
       }, 
       title: { 
        text: '% Change' 
       }, 
       opposite: true 
      }, 
      { //Left y-axis 
       labels: { 
        formatter: function() { 
         return '$' + Highcharts.numberFormat(this.value, 0, '', ','); 
        } 
       }, 
       title: { 
        text: 'Sales ($)' 
       } 
      }, 
      ], 
      series: [{ 
       name: 'Sales', 
       data: [measureValue[0], measureValue[1], measureValue[2]], 
       color: '#363534', 
       //Charcoal 
       yAxis: 1, 
       type: 'column' 
      }, 
      { 
       name: '% Change', 
       data: [changeValue[0], changeValue[1], changeValue[2]], 
       color: '#E17000', 
       //Pumpkin 
       //yAxis: 2, 
       type: 'spline' 
      }] 
     }); 
    }); 
} 

Answer 1

それはあなたのAJAXリクエストの原因である可能性があり、それがキャッチから結果を取得し、高速に実行]をクリックし最初次click.inで完了しませんでした。

これを試してみてください。

function updateTime3Period() { 
    timeFrameUpdate = 'Past 3 Periods'; 
    displayParam(); 

     $.ajax({ 
     url : 'PHP/getValues.php', 
     type : 'post', 
     data : { 
      type : "A", 
      type2 : B, 
      type3 : C, 
      type4 : D, 
      type5 : E, 
      type6 : F, 
      type7 : "getChartCurr" 
     }, 

     success : function (response2) { 
      obj2 = JSON.parse(response2); 
        $.ajax({ 
          url : 'PHP/getValues.php', 
          type : 'post', 
          data : { 
         type : "A", 
         type2 : B, 
         type3 : C, 
         type4 : D, 
         type5 : E, 
         type6 : F, 
         type7 : "getChartPrev" 
         }, 
          success : function (response3) { 
         obj3 = JSON.parse(response3); 
         updateCharts(obj2,obj3,measureUpdate); 
          } 
        }); 
     } 

    }); 
}