title: Device Compatibility in Jquery mobile / Unable to retrieve Radio button value in JQM 1.2.0
body: <p>Is there any standard way of coding in Jquery mobile... (ie) Why this question is because the same code for page event is working fine in some devices..and some devices not even produce error or alert... </p>
  
  <p><strong>Example:-</strong></p>
  
  <p>Check the below code </p>
  
  <pre><code>$(document).on('pageinit', "#pageid", function() {
      alert("inside page init");
      $('input[name="radioBtn"]').on('change', function () {
          alert($(this).val());
      });
  });
  </code></pre>
  
  <p>It is working fine in browsers both webkit, chrome and mozilla ...but not working in mobiles..</p>
  
  <p>I don't know what is wrong..Can anyone please advice..</p>
  
  <p><strong>NOTE:</strong> I tried and using the following link <a href="http://www.gajotres.net/document-onpageinit-vs-document-ready/" rel="nofollow">http://www.gajotres.net/document-onpageinit-vs-document-ready/</a>
   but still its not working...</p>
  
  <p><strong>This is about my page structure:</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  
      &lt;head&gt;
          &lt;meta charset="utf-8"&gt;
          &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
          &lt;title&gt;Multi-page template&lt;/title&gt;
          &lt;link rel="stylesheet" href="//code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /&gt;
          &lt;script src="http://code.jquery.com/jquery-1.8.2.min.js"&gt;&lt;/script&gt;
          &lt;script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"&gt;&lt;/script&gt;  
  
  &lt;script&gt;
          $(document).on('pageinit', "#main", function() {
              $('input[name="farmerGender"]').on('change', function () {
                  alert($('input[name=farmerGender]:checked').val());
              });
          });
  &lt;/script&gt;
      &lt;/head&gt;
  
      &lt;body&gt;
  
          &lt;div data-role="page" id="main"&gt;
  
              &lt;div data-role="header"&gt;
                  &lt;h2&gt;Header&lt;/h2&gt;
              &lt;/div&gt;
  
              &lt;div data-role="content"&gt;
  
                  &lt;div id="div-1"&gt;
                      &lt;ul&gt;
                          &lt;li&gt;Div-2&lt;/div&gt;&lt;/li&gt;
                          &lt;li&gt;Div-3&lt;/div&gt;&lt;/li&gt;
                      &lt;/ul&gt;   
                  &lt;/div&gt;
  
                  &lt;div id="div-2"&gt;
                      &lt;fieldset data-role="controlgroup"&gt;
                          &lt;input type="radio" name="radioBtn" id="rad-1" value="rd-1" checked="checked"/&gt; 
                          &lt;input type="radio" name="radioBtn" id="rad-2" value="rd-2"/&gt;   
                      &lt;/fieldset&gt;
                  &lt;/div&gt;
  
                  &lt;div id="div-3"&gt;
                      content
                  &lt;/div&gt;
  
              &lt;/div&gt;
  
              &lt;div data-role="footer"&gt;
                  &lt;h2&gt;Footer&lt;/footer&gt;
              &lt;/div&gt;
  
          &lt;/div&gt;
  
      &lt;body&gt;
      &lt;/html&gt;
  </code></pre>
  
  <p>Please check and let me know is there any wrong in this code....</p>
  
  <p>Thanks in advance...</p>