title: Submit form in steps via AJAX
body: <p>I have a form that looks like this below in a PHP file (inside Wordpress plugin). The form is also processed inside of this same file.</p>
  
  <p>I am wanting to save this form in "steps".  For example, user will select 4-5 choices on page 1, then I want AJAX to post choices. Then user proceeds to page 2, choices are again saved, etc. Last page will have a CAPTCHA for the final submission (if that even matters, I don't know in this specific case).</p>
  
  <p>I am wanting to use the entire interface as one single form, and then hide/show each page inside of a <code>&lt;div&gt;</code> using jQuery. </p>
  
  <p>I would like to know:</p>
  
  <p>1) How to submit user choices using AJAX for this specific type of form.</p>
  
  <p>2) What is the most efficient way of navigating through this form in "steps"?</p>
  
  <p>3) I also want each page to operate independently when it comes to form validation. Is it possible to do this?</p>
  
  <pre><code>            &lt;form id="quotation_form" name="form" action="#" method="post"&gt;
                &lt;div id="page1"&gt;
                &lt;div id="step0_header" class="steps-headers" onClick="step0ToggleClick();"&gt;Step 1&lt;span style="margin-left:30px;"&gt;Sun Exposure&lt;/span&gt;&lt;/div&gt;
                  &lt;div id="step0" class="quotation-steps"&gt;&lt;strong&gt;Describe the sun exposure of your planter...&lt;/strong&gt;&lt;br/&gt;
                    &lt;div class="radio-container"&gt;&lt;input type="radio" name="sun_exposure" id="sun_exposure_sunny_most" value="sunny_most"&lt;?php checked( 'sunny_most',$_POST['sun_exposure']); ?&gt; /&gt;&lt;label class="label-quotation-steps"&gt;Sunny most of the day&lt;/label&gt;&lt;br class="clear"/&gt;&lt;/div&gt;
                    &lt;div class="radio-container"&gt;&lt;input type="radio" name="sun_exposure" id="sun_exposure_shady_morning" value="shady_morning"&lt;?php checked( 'shady_morning',$_POST['sun_exposure']); ?&gt; /&gt;&lt;label class="label-quotation-steps"&gt;Shady Morning (Sunny Afternoon)&lt;/label&gt;&lt;br class="clear"/&gt;&lt;/div&gt;
                    &lt;div class="radio-container"&gt;&lt;input type="radio" name="sun_exposure" id="sun_exposure_sunny_morning" value="sunny_morning"&lt;?php checked( 'sunny_morning',$_POST['sun_exposure']); ?&gt; /&gt;&lt;label class="label-quotation-steps"&gt;Sunny Morning (Shady Afternoon)&lt;/label&gt;&lt;br class="clear"/&gt;&lt;/div&gt;
                    &lt;div class="radio-container"&gt;&lt;input type="radio" name="sun_exposure" id="sun_exposure_shady_most" value="shady_most"&lt;?php checked( 'shady_most',$_POST['sun_exposure']); ?&gt; /&gt;&lt;label class="label-quotation-steps"&gt;Shady most of the day&lt;/label&gt;&lt;br class="clear"/&gt;&lt;br class="clear"/&gt;&lt;/div&gt;
                  &lt;/div&gt;
  
                  &lt;div id="step1_header" class="steps-headers" onClick="step1ToggleClick();"&gt;Step 2&lt;span style="margin-left:30px;"&gt;Height&lt;/span&gt;&lt;/div&gt;
                    &lt;div id="step1" class="quotation-steps"&gt;&lt;strong&gt;What is the height of your planter?&lt;/strong&gt;&lt;br /&gt; 
                      &lt;div class="radio-container"&gt;&lt;input type="radio" name="height" id="height_1" value="height_1"&lt;?php checked( 'height_1',$_POST['height']); ?&gt;/&gt;&lt;label class="label-quotation-steps"&gt;8 to 14 inches&lt;/label&gt;&lt;br class="clear"/&gt;&lt;/div&gt;
                      &lt;div class="radio-container"&gt;&lt;input type="radio" name="height" id="height_2" value="height_2"&lt;?php checked( 'height_2',$_POST['height']); ?&gt;/&gt;&lt;label class="label-quotation-steps"&gt;15 to 20 inches&lt;/label&gt;&lt;br class="clear"/&gt;&lt;/div&gt;
                      &lt;div class="radio-container"&gt;&lt;input type="radio" name="height" id="height_3" value="height_3"&lt;?php checked( 'height_3',$_POST['height']); ?&gt;/&gt;&lt;label class="label-quotation-steps"&gt;21 inches or more&lt;/label&gt;&lt;br class="clear"/&gt;&lt;br class="clear"/&gt;&lt;/div&gt;
                    &lt;/div&gt;
  
                    &lt;input type="button" name="get_quote" id="get_quote" value="Save choices and continue..." class="request_quotation_btn" /&gt;
                    &lt;input type="hidden" name="submit" value="true" /&gt;
                 &lt;/div&gt; &lt;!-- #page1 --&gt;
  
                 &lt;div id="page2"&gt;
                   &lt;!-- Page2 stuff will go here, and is located in this same form. --&gt;
                 &lt;/div&gt;
               &lt;/form&gt;
  </code></pre>