通过ajax在phonegap应用程序中显示sql数据

时间:2012-11-22 00:27:07

标签: php html5 cordova blackberry-simulator

美好的一天......

我是手机新手,但我尽可能多地学习。 我目前正在开发一个基本应用程序,它从数据库中接收数据,并且必须在phonegap应用程序上输出。

到目前为止,我所做的工作如下: 在普通浏览器上,一切都按预期工作,数据按预期显示。 当我运行时,通过cmd运行ant blackberry load-simulator,我可以使用手机浏览器获得与普通浏览器相同的结果。

问题现在出现了,当我继续阅读应用程序并尝试打开我要显示数据的页面时,没有显示任何内容,我不明白为什么。

基本上发生的事情是,用户点击链接转到artciles页面,articles.html,这个页面与articles.js有关系,它只是发送一个ajax调用到php文件,articles.php,它从文章表中检索数据。

我怎样才能在应用程序而不是浏览器上查看数据? 这是我的所有代码。

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
    <link rel="stylesheet" type="text/css" href="css/index.css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="js/script.js"></script>
    <script src="articles.js"></script>
    <title> Articles</title>
</head>
<body>
    <div class="app">

    <div id="heading" style="background: #dddddd repeat-x" >
       <center><img src="img/logo.png" height="90" width="340" border="ridged"/></center>
        </div>

<div class="content">


<a href="index.html" style="color: white; text-decoration: none"> <img src="img/back.png"width="50" value="Back" height="50"/> Back to home</a>
</div>
</div>

</body>

以上是我的articles.html

$(document).ready(function() {
$.ajax({
        type: 'POST',
        url: './articles.php',
        dataType: 'jsonp',
        jsonp: 'jsoncallback',
        timeout: 5000,
        success: function(data){alert(data[0].title);//this alerts the tittle of the 1st record
            $('.content').append("<br />");
            for (var i = 0, len = data.length; i < len; i++) {
                       var code = data[i].title;
                       var desc = data[i].content.substring(0,100);
                       $('.content').append(code+'<br />'+desc+'<br /><br />success');
                   }
        },
        error: function(data){alert(data[0].title);
            $('.content').append("<br />");
            for (var i = 0, len = data.length; i < len; i++) {
                       var code = data[i].title;
                       var desc = data[i].content.substring(0,100);
                       $('.content').append(code+'<br />'+desc+'<br /><br />error');
                   }
        }
    });
 });

以上是我的articles.js,它发送一个ajax调用到一个php文件。

<?php
header('Content-type: application/json');

$server = "localhost";
$username = "root";
$password = "";
$database = "myDb";

$con = mysql_connect($server, $username, $password) or die ("Could not connect: " . mysql_error());
mysql_select_db($database, $con);
$sql = "SELECT * FROM  articles ORDER BY article_id";
$result = mysql_query($sql) or die ("Query error: " . mysql_error());
$records = array();

while($row = mysql_fetch_assoc($result)) {
    $records[] = $row;
}

mysql_close($con);
echo $_GET['jsoncallback'] . '(' . json_encode($records) . ');';
?>

这是我的articles.php

非常感谢任何建议或帮助。

1 个答案:

答案 0 :(得分:0)

我相信您必须在AJAX代码中指定PHP文件的完整URL。 将此url: './articles.php',更改为url: 'http://localhost/your_app_folder/your_php_file_ajax_processor.php'。希望这会有所帮助。