Не удается получить значения JSON с помощью Jquery - PullRequest
1 голос
/ 27 августа 2011

Я делаю что-то не так, но не могу понять, что это такое.

Строка $ .getJSON должна извлекать данные с помощью запроса AJAX, передавая ему выбранное в настоящее время имя фрукта. Затем данные циклически перебираются (это массив, содержащий индекс «сорт», содержащий название сорта фрукта) и добавляются в строку html, которая затем окончательно внедряется Jquery в диапазон #variety веб-страницы, заменяя то, что было ранее. 1003 *

HTML

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>Toevoegen</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>

    <script language="javascript" type="text/javascript">
        function populateFruitVariety() {

            var fruitName = $('input[name=fruitName]:checked').val();

            $.getJSON('func.php', {fruitName: fruitName}, function(fruit) {

                var html = '';
                $.each(fruit[fruitName], function(index, array) {
                    html = html + '<label><input type="radio" name="variety" value="' + array['variety'] + '" />' + array['variety'] + '</label> ';
                });
                $('#varieties').html(html);

            });

        }



        populateFruitVariety();
        $('input[name=fruitName]').change(function() {
            populateFruitVariety();
        });

    </script>

</head>
<body>

<form>

    <div>
        <strong>Fruit:</strong>
        <label><input type="radio" name="fruitName" value="Apple" checked="checked" />Apple</label>
        <label><input type="radio" name="fruitName" value="Banana" />Banana</label>
        <label><input type="radio" name="fruitName" value="Orange" />Orange</label>
        <label><input type="radio" name="fruitName" value="Pear" />Pear</label>
    </div>
    <div>
        <strong>Variety:</strong>
        <span id="varieties"></span>
    </div>
    <div>
        <strong>Type:</strong>
        <span id="type"></span>
    </div>
</form>

FUNC.PHP

<?php
$dsn = "mysql:host=localhost;dbname=dbname";
$username = "user";
$password = "pass";



$pdo = new PDO($dsn, $username, $password);


$rows = array();
if(isset($_GET['fruitName'])) {
    $stmt = $pdo->prepare("SELECT DISTINCT variety FROM fruit WHERE name = ? ORDER BY variety");
    $stmt->execute(array($_GET['fruitName']));
    $rows = $stmt->fetchAll(PDO::FETCH_ASSOC);

}

echo json_encode($rows);

?>

По какой-то причине это не работает должным образом, потому что Jquery не получит значения json, как я вижу из консоли.

При изменении последнего фрагмента кода jquery на:

$(function() {
            populateFruitVariety();
            $('input[name=fruitName]').change(function() {
                populateFruitVariety();
            });
        });

Значения будут получены в консоли, но не показаны как радиоблоки. Там все еще ошибка в консоли, хотя. (не определено)

Ответы [ 2 ]

2 голосов
/ 27 августа 2011

Я не могу проверить это, но если вы измените -

$.each(fruit[fruitName], function(index, array) {

на

$.each(fruit, function(index, array) {

это работает?

0 голосов
/ 02 августа 2012

Обратите внимание, что все, кто использует эти учебники, имеют возраст ! и с использованием jQuery 1.4.2 - я просто потратил больше дня, пытаясь сделать простую selectbox работу (http://www.electrictoolbox.com/json-data-jquery-php-mysql/, new Option(), похоже, не работает в 1.7.2), не работал с jQuery 1.7.2, когда я перешел на jQuery 1.4.2, он работал правильно.

В приведенном выше примере jroen использует jQuery 1.6.1, это может быть проблемой.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...