JQuery Mobile - Взаимодействие с диалогом

Question

Я использую JQuery Mobile для приложения.Хотя это отличная основа, есть некоторые нюансы, о которых я узнаю.В настоящее время у меня есть приложение на две страницы.Когда пользователь переходит на вторую страницу, я взаимодействую с веб-сервисом.Если веб-сервис возвращает успех, я загружаю вторую страницу.Если веб-служба возвращает сообщение об ошибке, я хочу показать им диалоговое окно с подсказкой.Для этого я сейчас делаю следующее:

my.js

$("#page2").live("pageshow", function () {
  var isGood = getResult();
  if (isGood == false) {
    $.mobile.changePage("/myDialog", { role: "dialog" });
  }
  else {
    // Continue loading page2 related information
  }
}); 

В настоящее время эта логика работает почти так, как мне нужно.Диалог появляется.Однако, когда я закрываю его, событие "PageShow" для "page2" снова запускаетсяТаким образом, загрузка диалога снова.По сути, у меня есть бесконечный цикл.Я не уверен, как обойти это.Это почти как диалог загружается в DOM самостоятельно, а не по отношению к странице.Из-за этого я не уверен, как реагировать на события диалога или взаимодействовать с ним.Как мне обойти это?

Спасибо

Answer 1

Я делаю что-то очень похожее, за исключением того, что я проверяю, что пользователь прошел диалог аутентификации. Следующий блок кода - суть того, как я выполняю эту операцию:

(function(){
  // Bind to jQM's page change event
  $(document).on('pagebeforechange', function(e, data) {
    var loadPage = function(){};

    if (typeof data.toPage !== "string") {
      // Continue with normal jQM operation
      return;
    }

    if (data.toPage.match(/skipCheck=1/)) {
      // We have already performed all of our checks.
      // Send the user on to the desired location.
      return;
    }

    loadPage = function() {
      // The user seems to be authorized right now so let's
      // send him on to his desired location.
      $.mobile.changePage(data.toPage + "?skipCheck=1", data.options);
    };

    if (data.toPage.match(/securedPage/)) {
      e.preventDefault(); // Stop the page load until we know more
      MYAPP.addEvent('isLoggedInComplete', loadPage);

      // This is where you would do something in lieu of the
      // the actual page change event.
    }
  });
}());

Обратите внимание, что у меня есть свой собственный объект, MYAPP, который имеет свою собственную систему событий. Я использую систему событий этого объекта, чтобы начать загрузку моей второй страницы.

Ключом к этому и ответом на ваш вопрос является проверка параметра запроса 'skipCheck'. Этот параметр используется в настоящее время для определения того, следует ли разрешить событию загрузки страницы завершаться как обычно, или мне следует перехватить его и сделать что-то еще.

Еще одно примечание: этот код взят из приложения, которое находится на очень ранней стадии разработки. Я учусь JQM, как я работаю над этим приложением. Таким образом, это может быть не лучшим способом решения проблемы.

Answer 2

Я не уверен, что это лучший способ сделать это, но он должен работать:

var dialogShown = false;

$("#page2").live("pageshow", function () {
  if(dialogShown)
    return;
  var isGood = getResult();
  if (isGood == false) {
    $.mobile.changePage("/myDialog", { role: "dialog" });
    dialogShown = true;
  }
  else {
    // Continue loading page2 related information
  }
});