JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html>
<head>
<title>Multipage jQM submit</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>
<body>
<form name="form1" action="multipageresult.php" method="POST">
<div id="page1" data-role="page">
<div data-role="header" data-theme="b" data-position="fixed">
<h1>Page1</h1>
</div>
<div data-role="content">
<fieldset data-role="controlgroup">
<legend>Your gender:</legend>
<input type="radio" name="gender" id="male" value="male" >
<label for="male">Male</label>
<input type="radio" name="gender" id="female" value="female" />
<label for="female">Female</label>
<label for="gender_comments">Your comments on gender</label>
<input type="text" name="gender_comments" id="gender_comments">
</fieldset>
<a href="#page2" data-role="button">Next</a>
</div>
</div>
<div id="page2" data-role="page">
<div data-role="header" data-theme="b" data-position="fixed">
<h1>Page2</h1>
<a href="#" data-rel="back" data-icon="arrow-l">Back</a>
</div>
<div data-role="content">
<fieldset data-role="controlgroup">
<legend>Your age group:</legend>
<input type="radio" name="age-group" id="ag1" value="1" checked="checked" />
<label for="ag1">20 to 29</label>
<input type="radio" name="age-group" id="ag2" value="2" />
<label for="ag2">30 to 39</label>
<input type="radio" name="age-group" id="ag3" value="3" />
<label for="ag3">40 to 49</label>
<input type="radio" name="age-group" id="ag4" value="4" />
...