0

これは 1 つの 2 つの質問です。私のコードの実際の状態は次のとおりです。

<script type="text/javascript">
init_ui();
function init_ui() {

        $("[rel='tooltip']").tooltip();

        $(".ajax_link").live("click",function(){
            id = $(this).attr("id");
            jQuery("#ajax_div").html('<img src="../../../../bundles/donepunctis/img/loading.gif" alt="loading...">');
            jQuery.ajax({
                url: '<?= $view['router'] -> generate('done_punctis_ajax_detail_data_url'); ?>' + '?id=' + id,
                success:function(result){
                    jQuery("#ajax_div").html('');
                    //alert(data);
                    chart.draw(data, options);
                }
     });
        })
}

var data;
var options;
var chart;

      // Load the Visualization API and the piechart package.
      google.load('visualization', '1.0', {'packages':['corechart']});

      // Set a callback to run when the Google Visualization API is loaded.
      google.setOnLoadCallback(drawChart);

      // Callback that creates and populates a data table,
      // instantiates the pie chart, passes in the data and
      // draws it.
      function drawChart() {

        // Create the data table.
        data = new google.visualization.DataTable();
        data.addColumn('string', 'Topping');
        data.addColumn('number', 'Slices');
        data.addRows([
          ['Mushrooms', 3],
          ['Onions', 1],
          ['Olives', 1],
          ['Zucchini', 1],
          ['Pepperoni', 2]
        ]);

        // Set chart options
        options = {'title':'How Much Pizza I Ate Last Night',
                       'width':400,
                       'height':300};

        // Instantiate and draw our chart, passing in some options.
        chart = new google.visualization.PieChart(document.getElementById('ajax_div'));

      }
</script>

現時点では、var データにハードコードされた somministrated チャートへのデータを使用して、ajax 呼び出しからの戻りを無視しています。

  1. 現在使用しているのと同じ値を返すためにphp側でエコーをどのように見る必要がありますが、ajaxリターンから渡されますか?

  2. このコードは最初は問題なく動作しますが、もう一度 ajax_link をクリックしようとすると、ajax 呼び出しが発生しますが、Google チャート コードは何もしません。何故ですか?

4

1 に答える 1

1

このコードは最初は問題なく動作しますが、もう一度 ajax_link をクリックしようとすると、ajax 呼び出しが発生しますが、Google チャート コードは何もしません。何故ですか?

呼び出しからの成功のコールバックを見てください$.ajax

jQuery.ajax({
  url: '<?= $view['router'] -> generate('done_punctis_ajax_detail_data_url'); ?>' + '?id=' + id,
  success:function(result){
  jQuery("#ajax_div").html('');
    chart.draw(data, options);
  }
});

を呼び出しchart.draw(data, options);ています。これは、最後に入力したデータでグラフを再描画するだけです。

drawChartおそらく新しいデータを呼び出して渡したいでしょう:

jQuery.ajax({
  url: '<?= $view['router'] -> generate('done_punctis_ajax_detail_data_url'); ?>' + '?id=' + id,
  success:function(result){
  jQuery("#ajax_div").html('');
    drawChart(data);
  }
});

次にdrawChart、チャートに新しいデータを入力できます。

function drawChart(myData) {
  // Create the data table.
  data = new google.visualization.DataTable();
  data.addColumn('string', 'Topping');
  data.addColumn('number', 'Slices');
  if(myData) {
    // TODO: add rows based on myData
  } else {
    data.addRows([
      ['Mushrooms', 3],
      ['Onions', 1],
      ['Olives', 1],
      ['Zucchini', 1],
      ['Pepperoni', 2]
    ]);
  }
  ...
于 2013-01-19T16:43:31.360 に答える