Программно открыть диалог в JQuery Mobile - PullRequest
Новая
       29

Программно открыть диалог в JQuery Mobile

6 голосов
/ 27 марта 2012

У меня есть один файл .html, который выглядит примерно так: 

<div id="myPage" data-role="page">
  <div data-role="header">
    <a href="#" data-icon="arrow-l" data-iconpos="notext" class="ui-btn-left jqm-home" onclick="backButton_Click();">Back</a>
    <h1>My App</h1>
  </div>

  <div>
    <input id="saveButton" type="button" value="Save" onclick="doStuff()" />
  </div>

  <script type="text/javascript">
    function doStuff() {
      var updatedText = getUpdatedText();
      $("#myMessage", "#myDialog").html(updatedText);                    
      $.mobile.changePage("#myDialog", { role: "dialog" });      
    }
  </script>
</div>

<div id="myDialog" data-role="page">
    <div id="myMessage"></div>
    <input id="button1" type="button" value="Button 1" data-theme="b" onclick="someJS1();" />
    <input id="button2" type="button" value="Button 2" data-theme="c" onclick="someJS2();" />
</div>

Когда вызывается doStuff (), я хочу установить собственное сообщение в тексте моего диалога и открыть диалоговое окно. По какой-то причине мне не удалось открыть myDialog. По жизни я не могу понять, что я делаю неправильно. Я проверил содержание, размещенное здесь: http://jquerymobile.com/demos/1.0a4.1/docs/pages/docs-pages.html

1 Ответ

19 голосов
/ 27 марта 2012

Я думаю, вам нужно установить роль страницы для диалога 

<div id="myDialog" data-role="dialog">
    <div id="myMessage"></div>
    <input id="button1" type="button" value="Button 1" data-theme="b" onclick="someJS1();" />
    <input id="button2" type="button" value="Button 2" data-theme="c" onclick="someJS2();" />
</div>

А затем откройте диалоговое окно с помощью 

$.mobile.changePage("#myDialog");

См. Скрипку http://jsfiddle.net/kYsVp/2/

...