dsj0312 2014-10-18 19:53
浏览 74
已采纳

来自mysql数据库的listview中的结果

Based on this topic: Changing the content of div in Jquery Mobile I want to retrieved data from mysql table using php and json but nothing is displayed in this operation.

Here are the information used:

json.php

$conexion = new mysqli("localhost", 'xxx', 'xxx', 'Operations');  

$query = "SELECT * FROM bugs";

$result = mysqli_query($conexion,$query);

while ($row = mysqli_fetch_array($result, MYSQL_ASSOC)) {

    $id['projectid'] = $row['projectid'];
    $id['status'] = $row['status'];
    $id['severity'] = $row['severity'];
    $id['title'] = $row['title'];
    $id['creation_date'] = $row['creation_date'];

    array_push($result_array,$id);

}

echo json_encode($result_array);

index.html

<!DOCTYPE html> 
<html> 
<head> 
<title>Bugs Administration</title> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.css" />
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.js"></script>
<script>
        $(document).live('pageinit',function (event) {
            $.ajax({
                url: 'http://127.0.0.1/app/json.php',
                data: "",
                dataType: 'json',
                success: function(data)        
                  {
                    for (var i = 0; i < data.length; i++) {
                      $('#list').append("<li><b>Project ID: </b>"+ data[i].projectid +
                                            "<b>Status: </b>"+ data[i].status+
                                            "<b>Severity: </b>"+ data[i].severity+
                                            "<b>Title: </b>"+ data[i].title+
                                            "<b>Creation Date: </b>"+ data[i].creation_date+
                                        "</li>"); 
                    }
                    $('#list').listview('refresh');

                 }
            });
        }); 
    </script>
</head> 
<body> 
<div data-role="page" id="bugs">
    <div data-role="header">
        <h1>List of Bugs</h1>       
    </div><!-- /header -->
    <div class="Main" data-role="content">  
        <h3>Current opened bugs</h3>       
        <ul data-role="listview" id="list"></ul>
    </div><!-- /content -->
    <div data-role="footer">
        <h3>Mobile App</h3>
    </div><!-- /footer -->
</div><!-- /page -->
</body>
</html>

Actually this is the result:

enter image description here

What I'm doing wrong?

  • 写回答

1条回答 默认 最新

  • dongzhimeng2464 2014-10-18 20:21
    关注

    I think it's a cross domain issue, can you try to do your ajax call with a relative path if your index.html file is in the same folder as your json.php ?

    $.ajax({
        url: 'json.php',
        data: "",
        dataType: 'json',
        success: function(data)
        {
            for (var i = 0; i < data.length; i++) {
                $('#list').append("<li><b>Project ID: </b>"+ data[i].projectid +
                    "<b>Status: </b>"+ data[i].status+
                    "<b>Severity: </b>"+ data[i].severity+
                    "<b>Title: </b>"+ data[i].title+
                    "<b>Creation Date: </b>"+ data[i].creation_date+
                    "</li>");
            }
            $('#list').listview('refresh');
    
        }
    });
    

    Here is the full index.html code :

    <!DOCTYPE html>
    <html>
    <head>
        <title>Bugs Administration</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.css" />
        <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.js"></script>
        <script>
            $(document).live('pageinit',function (event) {
                $.ajax({
                    url: 'json.php',
                    data: "",
                    dataType: 'json',
                    success: function(data)
                    {
                        console.log(data);
                        for (var i = 0; i < data.length; i++) {
                            $('#list').append("<li><b>Project ID: </b>"+ data[i].projectid +
                                "<b>Status: </b>"+ data[i].status+
                                "<b>Severity: </b>"+ data[i].severity+
                                "<b>Title: </b>"+ data[i].title+
                                "<b>Creation Date: </b>"+ data[i].creation_date+
                                "</li>");
                        }
                        $('#list').listview('refresh');
    
                    }
                });
            });
        </script>
    </head>
    <body>
    <div data-role="page" id="bugs">
        <div data-role="header">
            <h1>List of Bugs</h1>
        </div><!-- /header -->
        <div class="Main" data-role="content">
            <h3>Current opened bugs</h3>
            <ul data-role="listview" id="list"></ul>
        </div><!-- /content -->
        <div data-role="footer">
            <h3>Mobile App</h3>
        </div><!-- /footer -->
    </div><!-- /page -->
    </body>
    </html>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 这个电路是如何实现路灯控制器的,原理是什么,怎么求解灯亮起后熄灭的时间如图?
  • ¥15 matlab数字图像处理频率域滤波
  • ¥15 在abaqus做了二维正交切削模型,给刀具添加了超声振动条件后输出切削力为什么比普通切削增大这么多
  • ¥15 ELGamal和paillier计算效率谁快?
  • ¥15 file converter 转换格式失败 报错 Error marking filters as finished,如何解决?
  • ¥15 Arcgis相交分析无法绘制一个或多个图形
  • ¥15 关于#r语言#的问题:差异分析前数据准备,报错Error in data[, sampleName1] : subscript out of bounds请问怎么解决呀以下是全部代码:
  • ¥15 seatunnel-web使用SQL组件时候后台报错,无法找到表格
  • ¥15 fpga自动售货机数码管(相关搜索:数字时钟)
  • ¥15 用前端向数据库插入数据,通过debug发现数据能走到后端,但是放行之后就会提示错误