Mimicking a CLI in a web page, using jQuery
<p>I want to mimic a <a href="http://en.wikipedia.org/wiki/Command-line_interpreter" rel="nofollow">CLI</a> in a web page, where a user types in a command on the page, and it is sent to the server for execution, and the response is displayed in the page - much like a CLI behavior.</p>

<p>My jQuery fu is not what it should be and I am thinking that this must be a 'pattern' that must occur quite often so maybe someone can point to a resource somewhere that has similar code, or maybe someone can get me started with a snippet posted in here.</p>

<p>Here is my first stab at it. Corrections, improvements welcome.</p>

<pre><code>&lt;html&gt;
  &lt;head&gt;
    &lt;title&gt;Simple CLI&lt;/title&gt;
    &lt;script src="jquery.js"&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;div&gt;
      &lt;div id="console"&gt;
      &lt;/div&gt;
      &lt;!-- Is having an input tag without an enclosing form tag valid (X)HTML? --&gt;
      &lt;input id="cmd_input" type="text" name="cli_cmd" /&gt;
    &lt;div
    &lt;script type="text/javascript"&gt;
    /* [CDATA[ */
    $(document).ready(function(){
       $.post('url': "example.php", {'cmd': $('#cmd_input').val()}, 
             function(data){ $('#cmd_input').append(data.resp); },
             'type': 'json');  
    });
    /* ]]&gt; */
    &lt;/script&gt;
  &lt;/body&gt;
&lt;/html&gt;
</code></pre>
