Всякий раз, когда я пытаюсь загрузить свои данные JSON в мой список или выбрать меню, ничего не появляется

Question

Всякий раз, когда я пытаюсь загрузить свои данные JSON в мой список или выбрать меню, ничего не появляется

0

Поэтому в основном, когда я загружаю свои данные из сценария сервера (retrieve.php), он показывает в showlist.html, используя $ ('# result'). Html (data). Но всякий раз, когда я пытаюсь загрузить свой список или selectbox с этими данными, ничего не происходит. ПОЖАЛУЙСТА, СОВЕТ, что я могу сделать неправильно

//SERVER-SIDE SCRIPT - retrieve.php

<?php

     $pdo = new PDO('mysql:host=localhost;dbname=sports_rush;charset=utf8', 'root', '');
     $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

    try {

      $query = "SELECT eid,event_title FROM event_table";
      $result = $pdo->prepare($query);
      $result->execute();
     while ($row = $result->fetch(PDO::FETCH_ASSOC)) {
       echo json_encode($row);
    }
   $db_connection = null;
     } catch (PDOException $e) {
       echo $e->getMessage();
   }
//I found this recursive function online to enable me force convert to UTF-8 all the strings contained in an array
function utf8ize($d) {
if (is_array($d)) {
    foreach ($d as $k => $v) {
        $d[$k] = utf8ize($v);
    }
} else {
    return utf8_encode($d);
}
return $d;
}
?>

//FILE THAT SHOWS MY DATA FROM SERVER-SIDE SCRIPT - Showlist.html
<!DOCTYPE html> 
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
<title>SHOW LIST</title>
<link rel="shortcut icon" href="../favicon.ico">
<link rel="stylesheet" type="text/css" media="screen" href="css/style.css"/>
<link rel="stylesheet" href="jquery-mobile/jquery.mobile-1.4.2.min.css" />
<script src="jquery-mobile/jquery-1.9.1.min.js"></script>
<script src="jquery-mobile/jquery.mobile-1.4.2.min.js"></script>
</head> 
<body> 

<div data-role="page" id="home_page">
<div data-role="header" data-theme="a">
<h1>Header</h1>

</div>
<div data-role="content">
<select name="zip" id="zip" onChange="initializeRetrieve()"></select>
<div id="result"></div>
<ul data-role="listview" data-inset="true" id="postallist"></ul>
</div>
</div>
<script>
$(function(){       
 $.ajax({
 url     :   'retrieve.php',
 type    :   "POST",
 success :   function(data){
 var output = '';
 $('#result').html(data);  //This is just a test to see my data
 $.each(data, function (index, value) {
output += '<li><a href="#">' + value.eid + '</a></li>';
});
$('#postallist').html(output).listview("refresh");
}
});
});

function initializeRetrieve(){
var $select5 = $('#zip');
//request the JSON data and parse into the select element
$.getJSON("retrieve.php", function(data){

//iterate over the data and append a select option where eid is in the json file
$.each(data, function(key, value){
$select5.append('<option>' + value.eid + '</option>');
});
});
}
</script>
</body>
</html>

user3661831 22 май 2014, в 00:43

Источник

0

Откройте консоль Chrome, сеть, затем откройте запрос и посмотрите, действительно ли в ответ поступили какие-либо данные.
Prosto Trader 21 май 2014, в 22:12
0

Я только что попытался использовать консоль Chrome, и она показала ответ, содержащий все мои данные JSON. но это также странно, потому что включает теги вместе с моими данными json. Например, он имеет <html> <body> [{МОИ ДАННЫЕ JSON ВСЕ ЗДЕСЬ}] </ body> </ html>.
user3661831 22 май 2014, в 00:08

Теги:

php

javascript

jquery

arrays

json

3 ответа

Ещё вопросы

Откройте консоль Chrome, сеть, затем откройте запрос и посмотрите, действительно ли в ответ поступили какие-либо данные.
Я только что попытался использовать консоль Chrome, и она показала ответ, содержащий все мои данные JSON. но это также странно, потому что включает теги вместе с моими данными json. Например, он имеет <html> <body> [{МОИ ДАННЫЕ JSON ВСЕ ЗДЕСЬ}] </ body> </ html>.

user3661831 · Answer 1 · 2014-05-22T23-29-00.000Z

//НАКОНЕЧНО РАБОТАЕТ. Проблема была в моем showlist.html. Нужно изменить мою инициализацию, когда открывается моя страница

<html>
<meta charset="utf-8" />
<title>SHOW LIST</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>
<body>
<div data-role="page" id="index">
    <div data-role="header" data-position="fixed">
       <h1>Sports Rush Events</h1>
    </div>

    <div data-role = "content">
          <div class="content-primary">
             <ul id="list" data-role="listview" data-filter="true"></ul>
          </div>
           <div id="result"></div>
    </div>

<script type="text/javascript">
$(document).on('pagebeforeshow', '#index', function(){ 
$.ajax({
url     :   'retrievelist.php',
type    :   "POST",
dataType: 'json',
success : function(data){
$.each(data,function(i,dat){
$("#list").append("<li><b>ID: </b>"+i+"</br><b> Name: </b>"+dat.event_title+"</li>");
                 });
$("#list").listview('refresh');
}
     });
         });
    </script>
    <div data-role="footer" data-position="fixed">
    </div>
</div>

TJB4rn3s · Answer 2 · 2014-05-21T20-42-00.000Z

0

Пробовали ли вы использовать метод GET

TJB4rn3s 21 май 2014, в 20:42

0

Попробовал метод get до сих пор работает
user3661831 21 май 2014, в 23:35

Prosto Trader · Answer 3 · 2014-05-21T20-08-00.000Z

Попробуйте поместить свой запрос в $ (document).ready

 $(document).ready(function(){
    $.getJSON('retrieve.php', function(data) {
       $('#result').html(data);
    })
});

Не должно иметь значения, так как скрипт находится в конце тела.
пробовал $ (документ) .ready (function () тоже, но не работал