title: Why is Dygraph using URL not working on 2nd attempt?
body: <p>I'm having trouble with Dygraph loading the CSV Data returned from a URL after the 1st request works.</p>
  
  <p>When the entire page loads (1st request), the graph properly gets the CSV data for the URL and displays the graph correctly.</p>
  
  <p>However, when I request to update the url file - different dates (2nd request), the request seems to work but the dygrapg is empty.</p>
  
  <p>Does someone know why it would work the first time and not the second? I keep thinking it's the response headers but then why would the first request work?</p>
  
  <p>The requested URL is the same for both dygraph csv results (only dates differ): <a href="https://www.website.com/status/get_chart_file/?id=8385&amp;from=2014-07-15&amp;to=2014-07-21" rel="nofollow">https://www.website.com/status/get_chart_file/?id=8385&amp;from=2014-07-15&amp;to=2014-07-21</a></p>
  
  <p><strong>Response from Request #1</strong></p>
  
  <pre><code>Cache-Control   no-cache
  Content-Length  118753
  Content-Type    application/CSV
  Date    Mon, 21 Jul 2014 15:56:20 GMT
  Last-Modified   Mon, 21 Jul 2014 15:56:21 GMT
  Pragma  no-cache
  Server  Microsoft-IIS/7.5
  X-Powered-By    PHP/5.3.28
  
  1405310685000,27.5,,,66,0,0,0,0,1,0 
  1405310685000,27.5,,,66,0,0,0,0,1,0
  1405310976000,27.5,,,66,0,0,0,0,1,0
  1405310976000,27.5,,,66,0,0,0,0,1,0
  1405311283000,27.5,,,66,0,0,0,0,1,0
  1405311283000,27.5,,,66,0,0,0,0,1,0
  1405311598000,27.5,,,65,0,0,0,0,1,0
  1405311598000,27.5,,,65,0,0,0,0,1,0
  1405311886000,27.5,,,65,0,0,0,0,1,0
  1405311886000,27.5,,,65,0,0,0,0,1,0
  1405312189000,27.5,,,65,0,0,0,0,1,0
  </code></pre>
  
  <p><strong>Response from Request #2</strong></p>
  
  <pre><code>Cache-Control   no-cache
  Content-Length  98981
  Content-Type    application/CSV
  Date    Mon, 21 Jul 2014 15:56:59 GMT
  Last-Modified   Mon, 21 Jul 2014 15:56:59 GMT
  Pragma  no-cache
  Server  Microsoft-IIS/7.5
  X-Powered-By    PHP/5.3.28
  
  1405396843000,27.5,,,41,0,0,0,0,1,0
  1405396843000,27.5,,,41,0,0,0,0,1,0
  1405397137000,27.5,,,41,0,0,0,0,1,0
  1405397137000,27.5,,,41,0,0,0,0,1,0
  1405397715000,27.5,,,40,0,0,0,0,1,0
  1405397715000,27.5,,,40,0,0,0,0,1,0
  1405398301000,27.5,,,40,0,0,0,0,1,0
  1405398301000,27.5,,,40,0,0,0,0,0,0
  1405398597000,27.5,,,40,0,0,0,0,0,0
  </code></pre>
  
  <p><strong>Javascript</strong></p>
  
  <pre><code>function zoomGraphX(minDate, maxDate) {
          switchDataFile('&lt;?php echo $url; ?&gt;');
          g.updateOptions({
              dateWindow: [minDate, maxDate]
          });
      }
  
         function switchDataFile(filepath){
          g.updateOptions({
              file: filepath
          });
      }
  </code></pre>
  
  <p><strong>**UPDATE</strong></p>
  
  <p>On page load: <a href="http://tinypic.com/r/2dvoscx/8" rel="nofollow">http://tinypic.com/r/2dvoscx/8</a></p>
  
  <p>On change of date selection: <a href="http://tinypic.com/r/6jm2w3/8" rel="nofollow">http://tinypic.com/r/6jm2w3/8</a></p>
  
  <p>Here's the code to run the Graph, perhaps the answer lies here:</p>
  
  <pre><code>      g = new Dygraph(document.getElementById("graphdiv"),
            '&lt;?php echo BASE_URL_SSL."status/get_chart_file/?room=".$room_id."&amp;from=".$start_date."&amp;to=".$end_date; ?&gt;',
            {
              labels: [  'chart_date', 'Temp.', 'Heat SP', 'Cool SP', 'Humidity', 'Compressor', 'Heater', 'Fan', 'OB Valve', 'Occupancy' , "System Status (1)"],
              labelsDiv: document.getElementById('status'),
              labelsSeparateLines: false,
              highlightCallback: function(e, x, pts, row) {
  
  
  
                    var current_temperature = g.getValue(row, 1);
                    var heat = g.getValue(row, 2);
                    var cool = g.getValue(row, 3);
                    var humidity = g.rawData_[row][4];
                    var compressor = g.getValue(row, 5);
                    var heater = g.getValue(row, 6);
                    var fan = g.getValue(row, 7);
                    var ob_valve = g.getValue(row, 8);
                    var occupancy = g.getValue(row, 9);
                    var system_status_1 = g.getValue(row, 10);
  
                    var datetime = new Date( (x) );
                    datetime = datetime.format("H:i d/m/Y");
                    $(".legend_last_update").html(datetime);
  
  
                    if (system_status_1 == 1 || system_status_1 == 2){
                          $(".legend_system").removeClass('off');
                          $(".legend_system").addClass('on');
                          $(".legend_system").html('ON');
                    }else{
                          $(".legend_system").removeClass('on');
                          $(".legend_system").addClass('off');
                          $(".legend_system").html('OFF');
                    }
  
                    if (degrees_type == "1"){
                        $('.legend_setpoint').html(current_temperature + '&amp;degF');
                        $('.legend_cool').html(cool + '&amp;degF');
                        $('.legend_heat').html(heat + '&amp;degF');
                    }else{
                        $('.legend_setpoint').html(current_temperature + '&amp;degC');
                        $('.legend_cool').html(cool + '&amp;degC');
                        $('.legend_heat').html(heat + '&amp;degC');
                    }
                    $('.legend_humidity').html(humidity + '%');
  
  
                    if (compressor == 1){
                          $(".legend_compressor").removeClass('off');
                          $(".legend_compressor").addClass('on');
                          $(".legend_compressor").html('Comp. ON');
                    }else{
                          $(".legend_compressor").removeClass('on');
                          $(".legend_compressor").addClass('off');
                          $(".legend_compressor").html('Comp. OFF');
                    }
  
                    if (heater == 1){
                          $(".legend_heater").removeClass('off');
                          $(".legend_heater").addClass('on');
                          $(".legend_heater").html('Heater ON');
                    }else{
                          $(".legend_heater").removeClass('on');
                          $(".legend_heater").addClass('off');
                          $(".legend_heater").html('Heater OFF');
                    }
  
                    switch(fan){
  
                        case 0:
                              $(".legend_fan").removeClass('low');
                              $(".legend_fan").removeClass('high');
                              $(".legend_fan").addClass('off');
                              $(".legend_fan").html('Fan OFF');
                              break;
  
  
                        case 1:
                              $(".legend_fan").removeClass('high');
                              $(".legend_fan").removeClass('off');
                              $(".legend_fan").addClass('low');
                              $(".legend_fan").html('Fan LOW');                         
                            break;
  
  
                        case 2:
                              $(".legend_fan").removeClass('low');
                              $(".legend_fan").removeClass('off');
                              $(".legend_fan").addClass('high');
                              $(".legend_fan").html('Fan HIGH');
                              break;
  
                    }
  
                    if (ob_valve == 1){
                          $(".legend_ob_valve").removeClass('off');
                          $(".legend_ob_valve").addClass('on');
                          $(".legend_ob_valve").html('OB ON');
                    }else{
                          $(".legend_ob_valve").removeClass('on');
                          $(".legend_ob_valve").addClass('off');
                          $(".legend_ob_valve").html('OB OFF');
                    }
  
                    switch(occupancy){
  
                    case 0:
                          $(".legend_occupancy").removeClass('occupied');
                          $(".legend_occupancy").addClass('empty');
                          $(".legend_occupancy").html('EMPTY');
                          break;
  
  
                    case 1:
                          $(".legend_occupancy").removeClass('empty');
                          $(".legend_occupancy").addClass('occupied');
                          $(".legend_occupancy").html('OCCUPIED');                          
                        break;
  
  
                    case 2:
                          $(".legend_occupancy").removeClass('empty');
                          $(".legend_occupancy").addClass('occupied');
                          $(".legend_occupancy").html('OCCUPIED');
                          break;
  
                    case 3:
                          $(".legend_occupancy").removeClass('empty');
                          $(".legend_occupancy").addClass('occupied');
                          $(".legend_occupancy").html('OCCUPIED');
                          break;
  
                }
  
  
                },
  
              fillGraph: 0,
              dateWindow: [&lt;?= strtotime($start_date).'000' ?&gt;,&lt;?= strtotime($end_date).'000' ?&gt;],
              animatedZooms: true,
              colors: ['#41F235', '#F73F38', '#338BF7'],
              strokeWidth: 3,
              visibility: [true, true, true, false, false, false, false, false, false, false],
              //title: ' ',
              yAxisLabelWidth: 20,
              axisLabelFontSize: 10,
              drawXGrid: false,
              drawYGrid: false,
              underlayCallback: function(canvas, area, g) {
  
                  &lt;?php if( !empty($occupancy_periods) ):  
                  foreach($occupancy_periods as $type =&gt; $periods):
                       if($type != '0'): 
                           foreach($periods as $period): ?&gt;
                            var bottom_left = g.toDomCoords('&lt;?php echo $period['start'] ?&gt;', +20);
                            var top_right = g.toDomCoords('&lt;?php echo $period['finish'] ?&gt;', +80);
                            canvas.fillStyle = "&lt;?php echo $colors[$type] ?&gt;";
                            canvas.fillRect(bottom_left[0], area.y, top_right[0] - bottom_left[0], area.h);
                          &lt;?php endforeach; 
                       endif; 
                   endforeach; 
                   endif;?&gt;
  
              },
  
  
              xValueFormatter: Dygraph.dateString_,
              xAxisLabelFormatter:
                  function(d, gran) {
                            return Dygraph.dateAxisFormatter(new Date(d.getTime() ), gran); // -3600*1000
                  },
              xValueParser: function(x) { return parseInt(x); },
              xTicker: Dygraph.dateTicker 
            }
           );
  </code></pre>