JQuery Mobile использует simpledialog2 для проверки подлинности - PullRequest
Новая
       16

JQuery Mobile использует simpledialog2 для проверки подлинности

3 голосов
/ 06 марта 2012

Я пытаюсь создать мобильное приложение jQuery, которое будет иметь страницу авторизации (т. Е. Диалоговое окно jqm с текстовым вводом и кнопкой отправки, где пользователь будет вводить свое имя пользователя, это будет проверено по списку пользователей / права доступа извлекаются из Parse, и если доступ предоставлен, диалоговое окно будет удалено, и пользователь сможет получить доступ к приложению). Я понимаю, что далеко от этого этапа, но в тот момент, когда я использовал плагин simpledialog2 с режимом Blank, создал макет того, как я хотел, чтобы диалоговое окно выглядело, и я собирался расширить его до полностью функционирующего модуля. 

$(document).delegate('#opendialog', 'click', function() {
   $('<div>').simpledialog2({
     mode: 'blank',
     headerText: 'App Auth',
     headerClose: true,
     dialogAllow: true,
     dialogForce: true,
     blankContent : 
       "<p>Please enter your username:<br/></p>"+
       "<form><input/><br/>"+
       "<a data-role='button'>Submit</a></form>"
  })
})

Когда я пытался расширить этот код, я продолжал получать ошибки, такие как «TypeError:« undefined »не является функцией (оценивает ...)» и не мог найти причину для них. Мне было интересно, если кто-нибудь может сказать мне, правильно ли я подхожу к этому? Я пытался создать страницу авторизации с помощью кнопки w. Режим ввода, как описано в http://dev.jtsage.com/jQM-SimpleDialog/demos2/blankin.html#/jQM-SimpleDialog/demos2/button.html но это также не сработало для меня. Любое руководство будет высоко ценится. :)

1 Ответ

0 голосов
/ 16 мая 2012

Вы можете привязаться к событию pagebeforechange, чтобы проверить, аутентифицирован ли пользователь.Если нет, вы можете динамически создавать и отображать диалог авторизации: 

jQuery("body").live("pagebeforechange", function(e, data) {
    if(typeof data.toPage !== 'string')
        return; 
    if(!userIsAuthenticated) {
        showAuthDialog();
        e.preventDefault();
        return false;
    }
});

Динамически генерируемый диалог может отображаться так: 

function showAuthDialog() {
    var dialog = jQuery('<div data-role="dialog"> <div data-role="content"> <h1>MyAuthDialog</h1> <p>Your auth form here.</p></div> </div>');

    // bind events to auth form here
    // ...

    jQuery.mobile.pageContainer.append(dialog);
    jQuery.mobile.changePage(dialog);
}
...