2014-10-18 6 views
0

На основании этой темы: Changing the content of div in Jquery Mobile Я хочу получить данные из таблицы mysql с помощью php и json, но в этой операции ничего не отображается.Результаты в списке из базы данных mysql

Вот информация используется:

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> 

На самом деле это результат:

enter image description here

Что я делаю неправильно?

+0

Что делает ваш АЯКС возврата вызова в консоли (F12 в большинстве браузеров)? –

+0

Uncaught TypeError: Невозможно прочитать свойство 'length' из null index.html: 17 $ .ajax.success index.html: 17 – m4g4bu

+0

вы можете 'var_dump ($ result_array);' перед 'echo json_encode ($ result_array);' и проверьте, возвращает ли вызов строки в вашем браузере консоли (если вы используете хром, это будет в сетевой панели)? –

ответ

0

Я думаю, что это проблема с перекрестным доменом, можете ли вы попытаться выполнить свой вызов ajax с относительным путем, если ваш файл index.html находится в той же папке, что и ваш 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'); 

    } 
}); 

Вот полный код 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: '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> 
+0

Я добавил это предупреждение (данные), и ответ приложения равен null, поэтому с вызовом есть что-то не так. – m4g4bu

+0

Является ли ваш файл json.php в той же папке, что и index.html файл ? –

+0

Да, оба есть – m4g4bu

Смежные вопросы