Question

I have a bar graph that I want to get activity for the current day and display it in the graph. This works fine for a specific day sent as a parameter to myservice below. I want to be able to change the day graphed through a text input. With the getChartData method called below, the chart doesn’t render. Why might this be?

$(function () {
  var chart;
  $(document).ready(function () {
    var options = {
      chart : {
        renderTo : 'container',
        type : 'column'
      },
      title : {
        text : 'Total by Time',
        x : -20 //center
      },            
      xAxis : {
        categories : ['1am', '2am', '3am', '4am', '5am', '6am', '7am', '8am', '9am', '10am', '11am', '12pm', '1pm',
          '2pm', '3pm', '4pm', '5pm', '6pm', '7pm', '8pm', '9pm', '10pm', '11pm', '12am']
      },
      yAxis : {
        min : 0,
        title : {
          text : 'Total'
        },
        stackLabels : {
          enabled : true,
          style : {
            fontWeight : 'bold',
            color : (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
          }
        }
      },
      tooltip : {
        formatter : function () {
          return '<b>' + this.series.name + '</b><br/>' +
          this.x + ': ' + this.y;
        }
      },
      legend : {
        layout : 'vertical',
        align : 'right',
        verticalAlign : 'top',
        x : -10,
        y : 100,
        borderWidth : 0
      },
      plotOptions : {
        column : {
          stacking : 'normal',
          dataLabels : {
            enabled : true,
            color : (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'
          }
        }
      },
      series : []
    };      
    getChartData();
  });   
});

function getChartData() {
  $.getJSON('http://localhost:8080/myservice/2012-03-23', function (data) {

    options.series = data;
    // Create the chart
    var chart = new Highcharts.Chart(options);
  });   
}

Answer 1

if two parameters are sent over from a form submit you can get those parameters and use the values in the getChartData url like:

 parts = window.location.search.substr(1).split("&");
 var $_GET = {};
 var custNoPart = parts[0].split("=");
 var dayDatePart = parts[1].split("=");

 var param1 = $_GET[decodeURIComponent(custNoPart[0])] = decodeURIComponent(custNoPart[1]);

  var param2 = $_GET[decodeURIComponent(custNoPart[1])] = decodeURIComponent(dayDatePart[1]);