Question

我有一个jquery移动问题，我想将显示从php返回的数据到jquery移动对话框中。

我该怎么做呢。

这里是Chad Lung的代码。请有人帮我修改一下。

文件名：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>

Answer 1

如何删除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>

在Jquery Mobile对话框中显示数据

1 个答案: