В диалоговой системе jQuery Mobile Framework нет практичности - PullRequest
0 голосов
/ 12 февраля 2012

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

Давайте возьмем пример диалогов. Все, что я хочу сделать, это показать случай простое диалоговое окно на конкретное событие.

if (message.type == "Error") { //if an error , show a dialog

$.mobile.changePage( "alert.html", {
    type: "post", 
    data: "alert_title="+message.type+"&alert_message="+message.content,
    transition: "pop",
    role: "dialog",
    reloadPage:true
},false, true); 
 }

В приведенном выше примере мы никогда не сможем обработать эти данные, потому что в DOM будет вызван alert.html, что сделает весь javascript бесполезным. Зачем даже предоставлять механизм данных, который не может быть эффективно обработан без использования хаков? Это очень расстраивает.

Да, и вот мой код alert.html:

<!DOCTYPE html>
<html>

    <head>
        <title>Alert</title>
        <!--#include virtual="header.inc" -->

    <script>
    alert("test");
    $('#alert_dialog').live('pageinit', function (event) {
    $("#alert_title").text($.urlParam('alert_title'));
    $("#alert_body").text($.urlParam('alert_message'));
    });
    </script>

    </head>

    <body>
        <div data-role="page" id="alert_dialog">
        <div data-role="header">
            <h1>Alert</h1>

        </div>

        <div data-role="content">
            <h1 id="alert_title">alert title</h1>
            <p id="alert_body">alert body</p>
            <a href="#" data-role="button" data-rel="back">OK</a>        
        </div>
    </div>
    </body>

</html>

1 Ответ

4 голосов
/ 13 февраля 2012

Не отвлекаясь на аргумент, давайте проанализируем ваш код и выясним, почему у вас могут возникнуть разочарования:

  1. Вы вызываете $ .mobile.changePage с данными в виде строки URL-параметров? Если вы использовали объект и указали тип URL:

    $.mobile.changePage('alert.html', 
          type: 'url',
          data: {
              alert_title: message.type,
              alert_message: message.content
          },
          transition: 'pop',
          role: 'dialog',
          reloadPage: true
    });
    

Теперь jQM безошибочно берет ваш объект данных и передает его в качестве параметров url в ваше диалоговое окно, если вы используете тип: 'POST', тогда он будет отправлять эти данные как переменные формы. Если вы использовали какой-либо серверный язык, вы можете аккуратно обрабатывать эти данные - очевидно, используя html, вы мало что можете сделать.


2. Под чистой обработкой данных я подразумеваю, что мы используем обработчик событий pageinit от jQM, я не уверен, на какие хаки вы ссылаетесь, но в любом случае на вашей странице вы прикрепите все необходимые данные к элементам DOM и сделаете ссылку на них в обработчик Pageinit. Я думаю, что это довольно чисто.


3. Поскольку вы передаете параметры URL на страницу HTML, я предполагаю, что вы не используете серверный язык, такой как PHP, Java, CF и т. Д.? Я думаю, что использование парсера JS src для параметров url - это скорее хак, чем использование правильного языка на стороне сервера. Если вы знаете какие-либо языки сервера, почему бы не использовать их? Вы можете вставлять передаваемые параметры прямо в строку, в диалоговом окне HTML - намного красивее, чем ваш метод. Итак, вы используете хак и жалуетесь, что ваш хак не работает в jQM, но правильные методы - это хаки? Или, может быть, вы думаете, что делаете это правильно, но написать немного PHP - слишком много работы?



Просто для справки, jQuery Mobile только загружает код между вашим div [data-role = "page"], то есть ваш JS в <head/> не будет вставлен - вам нужно поместить это в div

...