title: Getting the currently active page id
body: <p><strong>BACKGROUND</strong></p>
  
  <p>My app consist of 2 static pages and x number of dynamically generated pages. The number of dynamically generated pages varies from time to time. My first static page is a login page. Once you login you are taken to the 2nd static page which is a welcome screen and then you can start swiping left to view the dynamically generated pages.</p>
  
  <p><strong>What i want to achieve</strong></p>
  
  <p>I basically want to get the page id of the currently active page. As in i want to get the id of the page i am currently viewing. i tried the following </p>
  
  <pre><code>pageId = $('body').pagecontainer('getActivePage').prop("id"); 
  console.log('==========================&gt;THIS IS ID: '+pageId);
  </code></pre>
  
  <p>It only gives me the page id of the 2nd static page and not the id of the dynamically generated pages because when i swipe left to view my dyanamically generated pages the console log does not print at all.</p>
  
  <p>Here is the code for the entire relevant js</p>
  
  <pre><code>var widgetNames = new Array();
  var widgetId = new Array();
  //ActivePageId
  var pageId = ''
  
  $(document).on("pagecreate", function () {
      $("body &gt; [data-role='panel']").panel().enhanceWithin();
  
  });
  
  $(document).on('pagecreate', '#page1', function () {
  
      $("#log").on('click', function () {
  
          $.ajax({
              url: "script.login",
              type: "GET",
              data: {
                  'page': 'create_user',
                      'access': 'user',
                      'username': $("input[name='username']").val(),
                      'password': $("input[name='password']").val()
              },
              dataType: "text",
              success: function (html) {
                  console.log(html);
                  widgetNames = new Array();
                  widgetId = new Array();
                  var res = html.match(/insertNewChild(.*);/g);
                  for (var i = 0; i &lt; res.length; i++) {
                      var temp = res[i].split(',');
                      if (temp.length &gt;= 3) {
                          widgetNames[i] = (temp[2].replace('");', '')).replace('"', '');
                          widgetId[i] = temp[1].replace("'", "").replace("'", "").replace(/ /g, '');
                      }
                  }
                  var AllWidgets = ''
                  var testwidget = new Array();
                  var tempWidgetContent = html.match(/w\d+\.isHidden(.*)\(\) == false\)[\s\S]*?catch\(err\)\{ \}/gm);
  
                  for (var i = 0; i &lt; tempWidgetContent.length; i++) {
                      var widgetContent = tempWidgetContent[i].substring(tempWidgetContent[i].indexOf('{') + 1);
  
                      testwidget[i] = widgetContent.replace("site +", "");
                  }
                  var widgetPart = new Array();
                  for (var i = 0; i &lt; widgetNames.length; i++) {
                      var pageHeaderPart = "&lt;div data-role='page' id='" + widgetId[i] + "' data-pageindex='" + i + "' class='dynPageClass'&gt;&lt;div data-role='header' data-position='fixed'&gt;&lt;a data-iconpos='notext' href='#panel' data-role='button' data-icon='flat-menu'&gt;&lt;/a&gt;&lt;h1&gt;BASKETBALL FANATICO&lt;/h1&gt;&lt;a data-iconpos='notext' href='#page2' data-role='button' data-icon='home' title='Home'&gt;Home&lt;/a&gt;&lt;/div&gt; &lt;div data-role='content'&gt;";
                      var pageFooterPart = "&lt;/div&gt;&lt;div data-role='footer' data-position='fixed'&gt;&lt;span class='ui-title'&gt;&lt;div id='navigator'&gt;&lt;/div&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;";
                      var check = "&lt;div data-role='content'&gt;&lt;ul data-role='listview'data-insert='true'&gt;&lt;li data-role='list-divider' data-theme='b'&gt;" + widgetNames[i] + "&lt;/div&gt;";
                      widgetPart[i] = '&lt;DIV style=\" text-align: center; background-color:#989797; font-size: 75pt;\" id=widgetContainer_' + widgetId[i] + '&gt;&lt;/DIV&gt;&lt;SCRIPT&gt;' + 'function UpdateWidgetDiv' + widgetId[i] + '() {' + testwidget[i] + '$(\"#widgetContainer_' + widgetId[i] + '").html(counterValue);' + '}' + 'setInterval(function(){UpdateWidgetDiv' + widgetId[i] + '()},3000)' + '&lt;/SCRIPT&gt;';
                      AllWidgets += '&lt;a href="#' + widgetId[i] + '" class="widgetLink" data-theme="b" data-role="button" &gt;' + widgetNames[i] + '&lt;/a&gt;';
                      var makePage = $(pageHeaderPart + check + widgetPart[i] + pageFooterPart);
  
                      makePage.appendTo($.mobile.pageContainer);
                  }
                  $('#items').prepend(AllWidgets).trigger('create');
  
                  //Get Active Page ID
       $( ":mobile-pagecontainer" ).on( "pagecontainershow", function( event, ui ) {
                            pageId = $('body').pagecontainer('getActivePage').prop("id"); 
                            alert( "The page id of this page is: " + pageId );
                            });
  
              }
          });
      });
  });
  </code></pre>
  
  <p>Please advise and sorry if it is a bad question to ask as I am a beginner. </p>