title: Can I get realtime PHP data to appear in a jquery dialog box?
body: <p>I'm trying to combine two ideas but I am not sure if they are compatible with one another.</p>
  
  <p>Idea 1:
  Have a php script run a command (EG: ping) and provide live results of the command in the web browser.</p>
  
  <p>Idea 2:
  Have a jQuery dialog box appear which, on open, runs the php script and provides the live results in the dialog box.</p>
  
  <p>Idea 1 was fairly easy to accomplish (ping.php):</p>
  
  <pre><code>&lt;?php
  header('Content-Type: text/html; charset=utf-8');
  set_time_limit(1800);
  ob_implicit_flush(true);
  ob_end_flush();
  
  $exe_command = 'C:\\Windows\\System32\\ping.exe -n 10 google.com';
  
  $descriptorspec = array(
      0 =&gt; array("pipe", "r"),  // stdin
      1 =&gt; array("pipe", "w"),  // stdout -&gt; we use this
      2 =&gt; array("pipe", "w")   // stderr 
  );
  flush(); 
  
  $process = proc_open($exe_command, $descriptorspec, $pipes);
  echo "&lt;pre&gt;";  
  
  if (is_resource($process))
  {
      while ($s = fgets($pipes[1])) {  
          print $s; 
  
          flush();  
      }  
  }
  echo "&lt;/pre&gt;"; 
  ?&gt;
  </code></pre>
  
  <p>If I open ping.php in my browser I get a line by line response YAY!!</p>
  
  <p>Idea 2 is whats giving me trouble.
  I can get the dialog box to open but the data does not appear until after the php finished working. This is likely the nature of ajax so I am probably way off the mark on the right way to do this.</p>
  
  <p>Here is the javascript I have in my index.html:</p>
  
  <pre><code>&lt;script language="Javascript"&gt;
  
  function testGetScript() {
      $.getScript("./cgi-bin/ping.php", function(data) {
          var divResults = document.getElementById('pingMe');
          divResults.innerHTML = data;
      });
  }
  
  function initDialogs() {
      $('#testDialog').dialog({
          autoOpen: false,
          width: 800,
          title: "PINGING.....",
          modal: true,
          open: function(event, ui) {
              testGetScript();
          },
          close: function() {
              $(this).dialog("close");
              },
          buttons: [
              {text: "Done", click: function() {
                  $(this).dialog("close");
              }}
          ]
      });
  
  }
  
  $(document).ready(function(){
      initDialogs();
  
      $("*[class='btn']").button().click(function() {
              $('#testDialog').dialog('open');
      });
  
  &lt;/script&gt;
  </code></pre>
  
  <p>Anyone have any thoughts on whether or not this is possible?
  If so do you have any advise on how this can be accomplished?</p>