title: Create a querystring out of form with jQuery isn't working
body: <p>I want to send an ajax request but the query string I'm trying to build is empty. </p>
  
  <pre><code>&lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
  &lt;title&gt;This is a project to show how to use RESTful&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;script type="text/javascript"&gt;var contexPath = "&lt;%=request.getContextPath()%&gt;";&lt;/script&gt;
  &lt;script src="&lt;%=request.getContextPath()%&gt;/js/jquery.js"&gt;&lt;/script&gt;
  
  
  &lt;script type="text/javascript"&gt;
  function doAjaxPost() {
      var queryString = $('#htmlform') // empty
  
      alert("doAjaxPost Called:" + queryString + ":");
  
      $.ajax({
          ...
          ...
      });
  }​    &lt;/script&gt;
  
  &lt;H1&gt;Add Employee&lt;/H1&gt;
  
  &lt;p&gt;
  &lt;form name="htmlform"&gt;
  &lt;table border=1&gt;
      &lt;thead&gt;&lt;tr&gt;
          &lt;th&gt;ID&lt;/th&gt;
          &lt;th&gt;Name&lt;/th&gt;
          &lt;th&gt;Email&lt;/th&gt;
      &lt;/tr&gt;&lt;/thead&gt;
  
      &lt;tr&gt;
          &lt;td&gt;&lt;input  type="text" name="ID" maxlength="5" size="3"&gt;&lt;/td&gt;
          &lt;td&gt;&lt;input  type="text" name="Name" maxlength="10" size="10"&gt;&lt;/td&gt;
          &lt;td&gt;&lt;input  type="text" name="Email" maxlength="10" size="10"&gt;&lt;/td&gt;
      &lt;/tr&gt;
  
  &lt;/table&gt;
  &lt;input type="button" value="Save Employee" onclick="doAjaxPost();" /&gt;
  &lt;p&gt;
  &lt;p&gt;
  &lt;/form&gt;
  [&lt;a href="http://localhost:8080/RESTful/service/employees"&gt;List all Employees&lt;/a&gt; | &lt;a href="add.jsp"&gt;Employee Form Test&lt;/a&gt;]
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>