title: Get radio button value after change page on Jquery Mobile
body: <p>I have 3 page of mobile web with Jquery Mobile. </p>
  
  <p>index.html file</p>
  
  <pre><code>&lt;div data-role="page" data-theme="a" id="index"&gt;
  &lt;div data-role="header" data-position="inline"&gt;
      &lt;h1&gt;&lt;img src="assets/images/logo_suggest_35_inv.png" alt=""&gt;&lt;/h1&gt;
  &lt;/div&gt;
  &lt;div data-role="content" data-theme="a"&gt;
      &lt;ul data-role="listview" data-inset="true"&gt;
          &lt;li&gt;&lt;a href="flight/" data-transition="slide"&gt;Book Flight&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;Hotel&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;Train&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  &lt;div data-role="footer" data-theme="a"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>and this is the second file. </p>
  
  <pre><code>&lt;div data-role="page" data-theme="a" id="search"&gt;
  &lt;div data-role="header" data-position="inline"&gt;
      &lt;h1&gt;&lt;img src="assets/images/logo_suggest_35_inv.png" alt=""&gt;&lt;/h1&gt;
  &lt;/div&gt;
  &lt;div data-role="content" data-theme="a"&gt;
      &lt;form id="searchform"&gt;
          &lt;div class="ui-grid-a"&gt;
              &lt;div class="ui-block-a"&gt;
                  &lt;input type="radio" name="trip" id="roundtrip" value="roundtrip" data-theme="a" checked="true" onclick="addDate()"&gt;
                  &lt;label for="roundtrip"&gt;Round Trip&lt;/label&gt;
              &lt;/div&gt;
              &lt;div class="ui-block-b" id="onedate"&gt;
                  &lt;input type="radio" name="trip" id="onetrip" value="onetrip" data-theme="a" onclick="removeDate()"&gt;
                  &lt;label for="onetrip"&gt;One Way&lt;/label&gt;
              &lt;/div&gt;
          &lt;/div&gt;  
      &lt;/form&gt;
  &lt;/div&gt;
  &lt;div data-role="footer" data-theme="a"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>this is third file.</p>
  
  <pre><code>&lt;div data-role="page" data-theme="a" id="select"&gt;
  &lt;div data-role="header" data-position="inline"&gt;
      &lt;h1&gt;&lt;img src="assets/images/logo_suggest_35_inv.png" alt=""&gt;&lt;/h1&gt;
  &lt;/div&gt;
  &lt;div data-role="content" data-theme="a"&gt;
      &lt;!-- Show radio button if checked value --&gt;
  &lt;/div&gt;
  &lt;div data-role="footer" data-theme="a"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>I want to passing radio button data to select page from search page and save to new variable. example </p>
  
  <pre><code> if (document.getElementById("onetrip").checked == true) {
              var is_round_trip = 0;
          }
          else if (document.getElementById("roundtrip").checked == true) {
              var is_round_trip = 1;
          }
  </code></pre>
  
  <p>this is my javascript on first page.</p>
  
  <pre><code>$(document).on('pagebeforeshow','#select', function(e,data){
              var is_round_trip = data.prevPage.find('#onetrip');
          });
  </code></pre>
  
  <p>But i always get undefined value of 'is_round_trip'.
  Any solution if i want to get the value of is_round_trip based on radio button checked value from second page?</p>