Note that there are some explanatory texts on larger screens.

plurals
  1. POForm Posting data
    text
    copied!<p>I have a 3 page registration page. After the user selects an option on the first page and clicks submit, the form <strong>transforms</strong> into the next form using jquery's animate method, meaning it stays on the same page. The question I have is how to get the data from the first form because the content of the 2nd forms is dependent on that information. Here's my html:</p> <pre><code>&lt;div id="Registration" style="display:none;"&gt; &lt;div class="box"&gt; &lt;form id="frmtype1" action="#" name="frmtype1" method="post"&gt; &lt;header&gt;Registration Options&lt;/header&gt;&lt;br/&gt; &lt;label for="Reg_type1"&gt;&lt;input type="radio" name="Reg_type" id="Reg_type1" value="1"/&gt; Option 1&lt;/label&gt; &lt;br/&gt;&lt;br/&gt; &lt;label for="Reg_type2"&gt;&lt;input type="radio" name="Reg_type" id="Reg_type2" value="2"/&gt; Option 2&lt;/label&gt;&lt;br/&gt;&lt;br/&gt; &lt;label for="Reg_type3"&gt;&lt;input type="radio" name="Reg_type" id="Reg_type3" value="3"/&gt; Option 3&lt;/label&gt;&lt;br/&gt;&lt;br/&gt; &lt;p id="error_message" style="display:none"&gt;Please choose an option&lt;/p&gt;&lt;input type="submit" class="button" name="Submit" value="Submit"/&gt; &lt;/form&gt; &lt;form name="everything" id="everything" action="#" method="post"&gt; &lt;header&gt;Registration Information&lt;/header&gt;&lt;br/&gt; &lt;label&gt;First Name&lt;font color="red"&gt;*&lt;/font&gt;: &lt;input type="text" name="fname" id="fname" /&gt; &lt;/label&gt;&lt;br/&gt; Last Name*: &lt;input type="text" name="lname" id="lname" /&gt; &lt;br/&gt; Address*: &lt;input type="text" name="address" id="address" /&gt; &lt;br/&gt; &lt;/form&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>So once an option is selected, the first form disappears and the next one appears. So how do I get the data of which option they selected? Thanks</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload