title: Get javascript values from result of php script
body: <p>I have pie chart webpage (index.html) which is currently getting values from a static .js file.</p>
  <p>The original content of the .js file for the pie chart is this:</p>
  <pre><code>$( document ).ready(function() {
  
      var ctx110 = document.getElementById(&quot;chart110&quot;).getContext(&quot;2d&quot;);
  
      var data110 = [ 
          {   
                  &quot;value&quot;: 40, 
                  &quot;color&quot;: &quot;#F25656&quot;,
                  &quot;highlight&quot;: &quot;#FD7A7A&quot;,
                  &quot;label&quot;: &quot;Critical&quot;
          },  
          {   
                  &quot;value&quot;: 63.2452,
                  &quot;color&quot;: &quot;#22BAA0&quot;,
                  &quot;highlight&quot;: &quot;#36E7C8&quot;,
                  &quot;label&quot;: &quot;Other&quot;
          },  
          {   
                  &quot;value&quot;: 0,
                  &quot;color&quot;: &quot;#F2CA4C&quot;,
                  &quot;highlight&quot;: &quot;#FBDB6E&quot;,
                  &quot;label&quot;: &quot;Warning&quot;
          }   
      ];  
      
      var chart110 = new Chart(ctx110).Pie(data110,{
          segmentShowStroke : true,
          segmentStrokeColor : &quot;#fff&quot;,
          segmentStrokeWidth : 2,
          animationSteps : 100,
          animationEasing : &quot;easeOutBounce&quot;,
          animateRotate : true,
          animateScale : false,
          legendTemplate : &quot;&lt;ul class=\&quot;&lt;%=name.toLowerCase()%&gt;-legend\&quot;&gt;&lt;% for (var i=0; i&lt;segments.length; i++){%&gt;&lt;li&gt;&lt;span style=\&quot;background-color:&lt;%=segments[i].fillColor%&gt;\&quot;&gt;&lt;/span&gt;&lt;%if(segments[i].label){%&gt;&lt;%=segments[i].label%&gt;&lt;%}%&gt;&lt;/li&gt;&lt;%}%&gt;&lt;/ul&gt;&quot;,
          responsive: true
      }); 
      
      
  });
  
  </code></pre>
  <p>However, I need to make the values in the <code>var data110</code> variable dynamic.</p>
  <p>I have a php script that, when run, spits out the required value and my issue is, I'm having problems getting the pie chart to load after I incorporate the php script into the above code.</p>
  <p>Here's my attempt (I'm completely new to web development, so please forgive my ineptitude here - i know it's very ugly):</p>
  <pre><code>$( document ).ready(function() {
  
      var ctx110 = document.getElementById(&quot;chart110&quot;).getContext(&quot;2d&quot;);
      
      function internal_loadXMLDoc1() {
          var xmlhttp;
          if (window.XMLHttpRequest) {
                  xmlhttp=new XMLHttpRequest();
          }
              xmlhttp.onreadystatechange=function() {
                  if (xmlhttp.readyState==4 &amp;&amp; xmlhttp.status==200) {
                          document.getElementById(&quot;myDivAX1&quot;).innerHTML=xmlhttp.responseText;
                  }
          }
          xmlhttp.open(&quot;POST&quot;,&quot;getnum.php?os-metrics&quot;,true);
          xmlhttp.send();
      }
      var dskmetric = internal_loadXMLDoc1();
  
      var data110 = [ 
          {   
                  &quot;value&quot;: dskmetric, 
                  &quot;color&quot;: &quot;#F25656&quot;,
                  &quot;highlight&quot;: &quot;#FD7A7A&quot;,
                  &quot;label&quot;: &quot;Critical&quot;
          },  
          {   
                  &quot;value&quot;: 63.2452,
                  &quot;color&quot;: &quot;#22BAA0&quot;,
                  &quot;highlight&quot;: &quot;#36E7C8&quot;,
                  &quot;label&quot;: &quot;Other&quot;
          },  
          {   
                  &quot;value&quot;: 0,
                  &quot;color&quot;: &quot;#F2CA4C&quot;,
                  &quot;highlight&quot;: &quot;#FBDB6E&quot;,
                  &quot;label&quot;: &quot;Warning&quot;
          }   
      ];  
      
      var chart110 = new Chart(ctx110).Pie(data110,{
          segmentShowStroke : true,
          segmentStrokeColor : &quot;#fff&quot;,
          segmentStrokeWidth : 2,
          animationSteps : 100,
          animationEasing : &quot;easeOutBounce&quot;,
          animateRotate : true,
          animateScale : false,
          legendTemplate : &quot;&lt;ul class=\&quot;&lt;%=name.toLowerCase()%&gt;-legend\&quot;&gt;&lt;% for (var i=0; i&lt;segments.length; i++){%&gt;&lt;li&gt;&lt;span style=\&quot;background-color:&lt;%=segments[i].fillColor%&gt;\&quot;&gt;&lt;/span&gt;&lt;%if(segments[i].label){%&gt;&lt;%=segments[i].label%&gt;&lt;%}%&gt;&lt;/li&gt;&lt;%}%&gt;&lt;/ul&gt;&quot;,
          responsive: true
      }); 
      
      
  });
  </code></pre>
  <p>EDIT (based on @AL-zami advice):</p>
  <pre><code>$( document ).ready(function() {
  
  
      var ctx110 = document.getElementById(&quot;chart110&quot;).getContext(&quot;2d&quot;);
      
      function internal_loadXMLDoc1() {
          var xmlhttp;
          if (window.XMLHttpRequest) {
                  xmlhttp=new XMLHttpRequest();
          }
              xmlhttp.onreadystatechange=function() {
                  if (xmlhttp.readyState==4 &amp;&amp; xmlhttp.status==200) {
      
                       // Do your work here
                              var data110 = [ 
                                  {
                                          **&quot;value&quot;: [this needs to be dynamic]**, 
                                          &quot;color&quot;: &quot;#F25656&quot;,
                                          &quot;highlight&quot;: &quot;#FD7A7A&quot;,
                                          &quot;label&quot;: &quot;Critical&quot;
                                  },
                                  {
                                          **&quot;value&quot;: [this needs to be dynamic]**,
                                          &quot;color&quot;: &quot;#22BAA0&quot;,
                                          &quot;highlight&quot;: &quot;#36E7C8&quot;,
                                          &quot;label&quot;: &quot;Other&quot;
                                  },
                                  {
                                          &quot;value&quot;: 0,
                                          &quot;color&quot;: &quot;#F2CA4C&quot;,
                                          &quot;highlight&quot;: &quot;#FBDB6E&quot;,
                                          &quot;label&quot;: &quot;Warning&quot;
                                  }
                              ];
      
                              var chart110 = new Chart(ctx110).Pie(data110,{
                                  segmentShowStroke : true,
                                  segmentStrokeColor : &quot;#fff&quot;,
                                  segmentStrokeWidth : 2,
                                  animationSteps : 100,
                                  animationEasing : &quot;easeOutBounce&quot;,
                                  animateRotate : true,
                                  animateScale : false,
                                  legendTemplate : &quot;&lt;ul class=\&quot;&lt;%=name.toLowerCase()%&gt;-legend\&quot;&gt;&lt;% for (var i=0; i&lt;segments.length; i++){%&gt;&lt;li&gt;&lt;span style=\&quot;background-color:&lt;%=segments[i].fillColor%&gt;\&quot;&gt;&lt;/span&gt;&lt;%if(segments[i].label){%&gt;&lt;%=segments[i].label%&gt;&lt;%}%&gt;&lt;/li&gt;&lt;%}%&gt;&lt;/ul&gt;&quot;,
                                  responsive: true
                              });
  
                  }   
          }
          xmlhttp.open(&quot;POST&quot;,&quot;getnum.php?os-metrics&quot;,true);
          xmlhttp.send();
      }   
  
      internal_loadXMLDoc1();
  
  
  });
  </code></pre>
  <p>Here's the PHP script <code>getnum.php</code>:</p>
  <pre><code>&lt;?php
  $allargs = $_SERVER[&quot;argv&quot;];
  $argscou = $_SERVER[&quot;argc&quot;];
  if ( $argscou == 0 ) {
      die();
  } else {
      $upatterns = var_export($allargs, true) ;
      if (strpos($upatterns, '__') !== false) {
          $type_val = explode(&quot;__&quot;, $allargs[0]);
      } else {
          $type_val = $allargs;
      }
      $compon1 = $type_val[0];
      if ($compon1== &quot;30day-expirations&quot;) {
          $compon2 = $type_val[1];
          echo '&lt;p class=&quot;counter&quot;&gt;' . &quot;$compon2&quot; . '&lt;/p&gt;'. &quot;\n&quot;;
      } else if ( ($compon1 == &quot;getnum.php&quot;) || ($compon1 == &quot;os-disk-usage&quot;) ) {
          $duvalue = &quot;400&quot;;
          echo &quot;$duvalue&quot;;
          file_put_contents('4filename.txt', $duvalue, FILE_APPEND);
      }
  }
  
  ?&gt;
  </code></pre>