0

这是一个两个问题，我的代码的实际状态是这样的：

<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>

目前，我只是忽略了 ajax 调用的返回，将数据用于图表 somministrated 硬编码在 var 数据上。

  1. 如何在 php 端查看我的 echo 以返回我现在使用的相同值，但从 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 回答