title: Programmatically Open a Dialog in JQuery Mobile
body: <p>I have a single .html file that looks similar to the following:</p>
  
  <pre><code>&lt;div id="myPage" data-role="page"&gt;
    &lt;div data-role="header"&gt;
      &lt;a href="#" data-icon="arrow-l" data-iconpos="notext" class="ui-btn-left jqm-home" onclick="backButton_Click();"&gt;Back&lt;/a&gt;
      &lt;h1&gt;My App&lt;/h1&gt;
    &lt;/div&gt;
  
    &lt;div&gt;
      &lt;input id="saveButton" type="button" value="Save" onclick="doStuff()" /&gt;
    &lt;/div&gt;
  
    &lt;script type="text/javascript"&gt;
      function doStuff() {
        var updatedText = getUpdatedText();
        $("#myMessage", "#myDialog").html(updatedText);                    
        $.mobile.changePage("#myDialog", { role: "dialog" });      
      }
    &lt;/script&gt;
  &lt;/div&gt;
  
  &lt;div id="myDialog" data-role="page"&gt;
      &lt;div id="myMessage"&gt;&lt;/div&gt;
      &lt;input id="button1" type="button" value="Button 1" data-theme="b" onclick="someJS1();" /&gt;
      &lt;input id="button2" type="button" value="Button 2" data-theme="c" onclick="someJS2();" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>When "doStuff()" is called, I want to set a custom message in the text of my dialog and open the dialog. For some reason, I have been unable to open the myDialog. For the life of me, I cannot figure out what I'm doing wrong. I have reviewed the content posted here: <a href="http://jquerymobile.com/demos/1.0a4.1/docs/pages/docs-pages.html" rel="noreferrer">http://jquerymobile.com/demos/1.0a4.1/docs/pages/docs-pages.html</a></p>