Отображать данные в Jquery Mobile Dialog - PullRequest
1 голос
/ 04 ноября 2011

У меня проблема с мобильным jquery, я хочу отобразить возвращенные данные из php в мобильном диалоге jquery.

Как мне это сделать.

вот код от Чад Лунг. Пожалуйста, может кто-нибудь помочь мне изменить это.

Имя файла: callajax.php

 <?php
    $firstName = $_POST[firstName];
    $lastName = $_POST[lastName];

    echo("First Name: " . $firstName . " Last Name: " . $lastName);
?>

Имя файла: index.html

 <!DOCTYPE html>
<html>
    <head>
    <title>Submit a form via AJAX</title>
      <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.css" />
      <script src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
      <script src="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.js"></script>
</head>
<body>
    <script>
        function onSuccess(data, status)
        {
            data = $.trim(data);
            $("#notification").text(data);
        }

        function onError(data, status)
        {
            // handle an error
        }        

        $(document).ready(function() {
            $("#submit").click(function(){

                var formData = $("#callAjaxForm").serialize();

                $.ajax({
                    type: "POST",
                    url: "callajax.php",
                    cache: false,
                    data: formData,
                    success: onSuccess,
                    error: onError
                });

                return false;
            });
        });
    </script>

    <!-- call ajax page -->
    <div data-role="page" id="callAjaxPage">
        <div data-role="header">
            <h1>Call Ajax</h1>
        </div>

        <div data-role="content">
            <form id="callAjaxForm">
                <div data-role="fieldcontain">
                    <label for="firstName">First Name</label>
                    <input type="text" name="firstName" id="firstName" value=""  />

                    <label for="lastName">Last Name</label>
                    <input type="text" name="lastName" id="lastName" value=""  />
                    <h3 id="notification"></h3>
                    <button data-theme="b" id="submit" type="submit">Submit</button>
                </div>
            </form>
        </div>

        <div data-role="footer">
            <h1>GiantFlyingSaucer</h1>
        </div>
    </div>
</body>
</html>

1 Ответ

0 голосов
/ 04 ноября 2011

Как насчет того, чтобы отбросить ваш ajax-запрос и использовать вместо этого этот метод:

$.mobile.changePage( "callajax.php", {
    type: "post", 
    data: $("form#callAjaxForm").serialize(),
    transition: "pop",
    reverse: false,
    changeHash: false
});     

Тогда ваш PHP должен вернуть полный элемент мобильной страницы jquery, например:

<div data-role="page" id="ajaxResultPage">
    <div data-role="header">
        <h1>Ajax Results</h1>
    </div>
    <div data-role="content">
        <?php echo("First Name: " . $firstName . " Last Name: " . $lastName); ?>
    </div>
</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...